在CSS中设置px（像素）值非常简单。px是CSS中最常用的长度单位之一，用于指定元素的大小、位置、间距等。
以下是一些示例，展示如何在CSS中使用px值：
设置元素宽度和高度
css复制代码
.box { |
|
width: 200px; /* 设置元素宽度为200像素 */ |
|
height: 100px; /* 设置元素高度为100像素 */ |
|
} |
设置字体大小
css复制代码
p { |
|
font-size: 16px; /* 设置段落文本字体大小为16像素 */ |
|
} |
设置内边距（padding）
css复制代码
.container { |
|
padding: 10px; /* 设置元素的内边距为10像素，上下左右都相同 */ |
|
/* 或者 */ |
|
padding-top: 20px; /* 设置元素的上内边距为20像素 */ |
|
padding-right: 15px; /* 设置元素的右内边距为15像素 */ |
|
padding-bottom: 10px; /* 设置元素的下内边距为10像素 */ |
|
padding-left: 5px; /* 设置元素的左内边距为5像素 */ |
|
} |
设置外边距（margin）
css复制代码
.box { |
|
margin: 20px; /* 设置元素的外边距为20像素，上下左右都相同 */ |
|
/* 或者 */ |
|
margin-top: 30px; /* 设置元素的上外边距为30像素 */ |
|
margin-right: 25px; /* 设置元素的右外边距为25像素 */ |
|
margin-bottom: 20px; /* 设置元素的下外边距为20像素 */ |
|
margin-left: 10px; /* 设置元素的左外边距为10像素 */ |
|
} |
设置边框（border）
css复制代码
.box { |
|
border: 1px solid black; /* 设置元素边框宽度为1像素，样式为实线，颜色为黑色 */ |
|
/* 或者单独设置 */ |
|
border-width: 2px; /* 设置边框宽度为2像素 */ |
|
border-style: dashed; /* 设置边框样式为虚线 */ |
|
border-color: red; /* 设置边框颜色为红色 */ |
|
} |
设置定位（position）和偏移（top, right, bottom, left）
css复制代码
.box { |
|
position: absolute; /* 绝对定位 */ |
|
top: 50px; /* 距离顶部50像素 */ |
|
left: 100px; /* 距离左侧100像素 */ |
|
} |
在以上示例中，你可以看到px值是如何用于指定各种CSS属性的。这些值可以是整数或小数，取决于你的具体需求。记住，px是一个绝对单位，它不会根据其他因素（如父元素的字体大小或视口大小）而变化。