转载

CSS padding 内边距属性

CSS padding 属性

语法：

padding : length

参数：

length : 　由浮点数字和单位标识符组成的长度值 | 或者百分数。百分数是基于父对象的宽度。

说明：

检索或设置对象四边的补丁边距。
如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。
如果只提供一个，将用于全部的四条边。
如果提供两个，第一个用于上－下，第二个用于左－右。
如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。
内联对象要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。
不允许负值。
对应的脚本特性为 padding 。
关于对象的尺寸与边框，内外补丁等样式表属性的关系，请参看图例以及height和width属性。

示例：

body { padding: 36pt 24pt 36pt; }

body { padding: 11.5%; }

body { padding: 10% 10% 10% 10%; }

扩展阅读：

浏览器支持

IE	Firefox	Chrome	Safari	Opera

所有主流浏览器都支持 margin-bottom 属性。

注释：任何的版本的 Internet Explorer （包括 IE8）都不支持 "inherit" 和 "collapse" 属性值。

实例

设置 p 元素的 4 个内边距：

 p   {   padding:2cm 4cm 3cm 4cm;   }

定义和用法

padding 简写属性在一个声明中设置所有内边距属性。

说明

这个简写属性设置元素所有内边距的宽度，或者设置各边上内边距的宽度。行内非替换元素上设置的内边距不会影响行高计算；因此，如果一个元素既有内边距又有背景，从视觉上看可能会延伸到其他行，有可能还会与其他内容重叠。元素的背景会延伸穿过内边距。不允许指定负边距值。

注释：不允许使用负值。

例子 1

 padding:10px 5px 15px 20px;

上内边距是 10px
右内边距是 5px
下内边距是 15px
左内边距是 20px

例子 2

 padding:10px 5px 15px;

上内边距是 10px
右内边距和左内边距是 5px
下内边距是 15px

例子 3

 padding:10px 5px;

上内边距和下内边距是 10px
右内边距和左内边距是 5px

例子 4

 padding:10px;

所有 4 个内边距都是 10px

默认值：	0
继承性：	no
版本：	CSS1
JavaScript 语法：	object.style.padding="10px 5px"

可能的值

值	描述
auto	浏览器计算内边距。
length	规定以具体单位计的内边距值，比如像素、厘米等。默认值是 0px。
%	规定基于父元素的宽度的百分比的内边距。
inherit	规定应该从父元素继承内边距。