CSS内边距（padding）指的是元素边框与内容之间的距离。内边距可以通过padding-top、padding-right、padding-bottom、padding-left四个属性分别设置四个方向的值。也可以使用padding属性，在一个声明中同时设置四个方向的值。
例如：
.box {
padding: 20px;
}上述代码将.box元素的上下左右内边距都设置为20像素。
除了使用像素单位，内边距还可以使用其他的长度单位，比如百分比、em、rem等。
内边距同样可以使用负值，它的效果是将元素的内容超出边框的部分向外扩展。这在某些情况下可以用于实现一些特效效果。
示例代码：
<div class="box">
<p>这里是内容</p>
</div>.box {
width: 200px;
height: 200px;
border: 1px solid #ccc;
padding: 20px;
}上述示例代码通过设置.box元素的边框和内边距，使其成为一个带边框的方框，并在其中放置一段文本内容。
如果要将.box元素的内边距设置为不同的值，可以使用下面的代码：
.box {
padding-top: 30px;
padding-right: 20px;
padding-bottom: 40px;
padding-left: 15px;
}上述代码将.box元素的上内边距设置为30像素，右内边距设置为20像素，下内边距设置为40像素，左内边距设置为15像素。
除了内边距，CSS中还有外边距（margin）这个概念。边距与内边距的区别在于，边距是元素边框与相邻元素之间的距离，而内边距则是元素边框与内容之间的距离。两者都是用于调整元素在页面中的布局位置和间距。
带有内外边距的元素示例代码：
<div class="box1">
<p>这里是内容</p>
</div>
<div class="box2">
<p>这里是内容</p>
</div>.box1 {
width: 200px;
height: 200px;
margin: 20px;
padding: 20px;
border: 1px solid #ccc;
}
.box2 {
width: 200px;
height: 200px;
margin: 20px;
padding: 0;
border: 1px solid #ccc;
}上述代码使用了两个相邻的.box元素，它们都带有边距、内边距和边框。其中，.box1的内边距为20像素，.box2的内边距为0像素，这两个元素之间的距离由它们的外边距（margin）决定。
总结一下，CSS内边距用于控制元素的内容和边框之间的距离，可以通过四个方向的属性分别设置，也可以使用一个属性同时设置所有方向的值。内边距可以使用不同的长度单位和负值，以实现不同的效果。在布局页面的时候，内边距通常与外边距一起使用，以调整元素之间的间距和排列位置。
本文链接：http://task.lmcjl.com/news/15971.html