元素内部边距是指元素内容与元素四边边框之间的距离，内部边距的作用是让元素的内容在元素四周留有空白。内部边距使用标签padding，padding的属性值为数值或百分比。属性值为百分比时，其实际数值是相对于父元素宽度计算的，当父元素宽度发生变化时，padding的属性值也会发生变化。padding的属性值有1至4个，其使用方法如下所示。padding给出1个属性值时，元素的上内边距、右内边距、下内边距、左内边距都被定义为同一个值。下面的样式语句定义了元素上内边距是10px，右内边距是10px、下内边距是10px、左内边距是10px。padding给出2个属性值时，元素的上下内边距被定义为同一个值，元素的左右内边距被定义为同一个值。下面的样式语句定义了元素上下内边距是15px、左右内边距是10px。padding给出3个属性值时，元素的左右内边距被定义为同一个值。下面的样式语句定义了元素上内边距是15px、左右内边距是5px、下内边距是10px。padding给出4个属性值时，元素的上、右、下、左内边距分别被定义为不同的值。下面的样式语句定义了元素上内边距是10px、右内边距是5px、下内边距是15px、左内边距是20px。下面的HTML文档展示了padding的使用方法。在上面的网页代码中，分别定义了p1（padding有1个值）、p2（padding有2个值）、p3（padding有3个值）、p4（padding有4个值）四个样式，这四个样式分别应用于p元素。浏览器显示效果如下图所示。单独设置上、右、下、左内边距前面介绍的padding样式标签对元素的上、右、下、左内边距都会产生作用。另外，CSS提供了样式标签padding-top（设置上内边距）、padding-right（设置右内边距、padding-bottom（设置下内边距）、padding-left（设置左内边距），用于分别设置HTML元素上、右、下、左的内边距。下面的HTML文档展示了样式标签的使用方法。浏览器显示效果如下图所示。
转载请注明：http://www.aierlanlan.com/grrz/7844.html
