Padding（填充）属性定义元素边框与元素内容之间的空间。
Padding属性设置元素所有内边距的宽度，或者设置各边上内边距的宽度。行内非替换元素上设置的内边距不会影响行高计算；因此，如果一个元素既有内边距又有背景，从视觉上看可能会延伸到其他行，有可能还会与其他内容重叠。元素的背景会延伸穿过内边距。不允许指定负边距值。
当元素的 Padding（填充）（内边距）被清除时，所"释放"的区域将会受到元素背景颜色的填充。单独使用填充属性是在一个声明中设置元素的所内边距属性。缩写填充属性也可以使用，一旦改变一个数值，则padding对应的距离都会改变。
扩展资料：
可能的值：
auto：浏览器计算外边距。
length：规定以具体单位计的外边距值，比如像素、厘米等。默认值是 0px。
%：规定基于父元素的宽度的百分比的外边距。
inherit：规定应该从父元素继承外边距。
内外距离区别：
margin与padding如何进行区分，这是很多学html人的困扰，其实说白了padding 就是内容与边框的空隙。而margin则是模块与模块的空隙。
参考资料来源：百度百科-padding
padding属性用于设置内边距，即边框与内容之间的距离。
值的个数 /表达意思
padding:5px 1个值，代表上下左右都有5像素内边距；
padding:5px 10px 2个值，代表上下内边距是5像素 左右内边距是10像素；
padding:5px 10px 20px3个值，代表上内边距5像素，左右内边距10像素，下内边距20像素；
padding:5px 10px 20px 30px 4个值，上是5像素，右是10像素，下是20像素，左是30像素，顺时针。
以上4种情况，实际开发都会遇到。
给指定盒子添加padding值之后：
内边距处于父元素和子元素之间，设置在父元素上，可以理解成物品和盒子中间塞的那层泡沫塑料，使用padding属性。
padding后面可跟多个值，中间用空格分离，含义如下：
我们放置一个宽高为200px的红色大盒子，其中包着一个宽高为100px的粉色小盒子。
我们给大盒子设置一个内边距为50px。
我们会发现给父元素设置了一条左内边距后，它的宽度也被撑大了，这显然不是我们想要的效果，解决方法就是如果加了左内边距，就把父元素宽度缩小相应长度，比如我们刚刚增加了50px的左内边距，就把父元素宽度从200px变为150px，就能达到效果啦，其它方向也是一样的，比如加了上内边距就缩小高度。
下图就可以理解成一个盒子里面套了一个列表，中间有内边距：
我们再来看下面这个图案，由三个盒子和内边距绘制而成。
（盒子就可以替换成其它各种块元素，比如上图里面就是列表）
html：
css：
可以看到我省略了很多宽高。
（1）由于块元素默认宽度占一整行，高度由内容撑开，我们很多时候可以只给最外面的元素设置宽度，最内部的元素设置高度，其它省略，也能达到效果。
如图3-2-1中，我们只需要提供每个列表元素<li>的高度和外面大盒子的宽度即可，其它用内边距撑起或挤出。
（2）最终的高度和内部元素的宽度都是由最外元素宽度、最内元素高度和所有内边距撑起或者挤出来的。
如图3-3-2中：
中间橙色盒子的宽度=红色大盒子的宽度-红色大盒子的左右内边距
红色大盒子的高度=黄色小盒子的高度+橙色中盒子的上下内边距+红色大盒子的上下内边距。
以上操作仅针对块元素，对于内联元素， 左右内边距 是可以 正常使用 的，而 上下内边距 只能 延伸背景颜色 ，并不会把子元素挤到中间。
