边框的里面可以有一层边内补白(padding),边内补白定义了边框与边框里面内容的距离. 边内补白分为上边内补白(top),下边内补白(bottom),左边内补白(left),右边内补白(right). 边内补白只有width一种属性. 相关教程：CSS教程：margin属性定义边外补白 padding -- 定义边内补白 取值: <padding-width>{1,4} | inherit <padding-width>{1,4}: 边内补白宽度 inherit: 继承 初始值: 0 继承性: 否 适用于: 所有元素,,除了table-row-group, table-header-group, table-footer-group, table-row, table-column-group 和 table-column padding: 边内补白 padding-width的取值 <length>: 长度表示法 <percentage>: 百分比表示法,padding百分比的计算是基于生成的框的包含块的宽度. auto: 自动 提示: padding边内补白不可以取负值;边内补白是看不到的,因为它本身是透明的. 示例 为padding-width指定一个值 padding: padding-top/padding-right/padding-bottom/padding-left; p#onepaddings { padding:12px; } 所有边内补白全部为12px 等价于下面的定义 p#onepaddings { padding-top-width:12px; padding-right-width:12px; padding-bottom-width:12px; padding-left-width:12px; } 为padding-width指定两个值 padding: padding-top/padding-bottom padding-right/padding-left; p#threepaddings { padding:12px 5%; } 上下边内补白是12px,左右边内补白是5%(相对于整个页面). 等价于下面的定义 p#threepaddings { padding-top-width:12px; padding-right-width:5%; padding-bottom-width:12px; padding-left-width:5%; } 为padding-width指定三个值 padding: padding-top padding-right/padding-left padding-bottom; p#threepaddings { padding:12px 5% 0; } 上边内补白是12px,左右边内补白是5%(相对于整个页面),下边内补白是0. 等价于下面的定义 p#twopaddings { padding-top-width:12px; padding-right-width:5%; padding-bottom-width:0; padding-left-width:5%; } 为padding-width指定四个值 padding: padding-top padding-right padding-bottom padding-left; p#fourpaddings { padding:12px 5% -12px auto; } 上边内补白是12px,右边内补白是5%(相对于整个页面),下边内补白是-12px,左边内补白将根据浏览器自动调整. 如果padding属性后面跟随四个值,那么值的分配顺序是从上面开始以顺时针旋转分配. 等价于下面的定义 p#fourpaddings { padding-top-width:12px; padding-right-width:5%; padding-bottom-width:-12px; padding-left-width:auto; }

　　推荐阅读

　　css 背景样式属性说明

css背景样式 序号 中文说明 标记语法 1 背景颜色 {background-color:数值} 2 背景图片 {background-image: url(http://www.jb51.net/URL)|none} 3 背景重复 {background-repeat:inherit|no-repeat|r>>>详细阅读

本文标题：CSS padding属性定义边内补白

地址：http://www.17bianji.com/kaifa2/CSS/16770.html

 1/2    1