您现在的位置： 万盛学电脑网 >> 程序编程 >> 网页制作 >> DivCSS教程 >> 正文
CSS教程:3.3 内边距(padding)
作者：佚名 责任编辑：admin 更新时间：2022-06-22
padding．又称为内边距．用于控制内容与边框之间的距离。和前面介绍的边框类似，padding属性可以设置1、2、3或4个属性值，分别如下：
● 设置1个属性值时，表示上下左右4个padding均为该值；WANGYEXX.COM
● 设置2个属性值时，前者为上下padding的值，后者为左右padding的值；
● 设置3个属性值时．第1个为上padding的值，第2个为左右padding的值，第3个为下padding的值；
● 设置4个属性值时，按照顺时针方向，依次为上、右、下、左padding的值。
如果需要专门设置某一个方向的padding，可以使用padding-left，padding-right．padding-top或者padding-hortom来设置。例如有如下代码。
- <style type="text/css">
- #outerBox{
- width:128px;
- height:128px;
- padding:20px 20px 10px; /*上 左右 下*/
- padding-left:10px;
- border:10px gray dashed;
- }
- </style>
- <body>
- <div id="outerBox">
- <img src="wangyexx.com.gif">
- </div>
- </body>
其结果是上侧和右侧的padding为20像素，下侧和左侧的padding为10像素，如图1所示。
图1 设置padding后的效果
经验：当一个盒子设置了背景图像后，默认情况下背景图像覆盖的范围是padding和内容组成的范围，并以padding的左上角为基准点平铺背景图像。
- 上一个程序编程： CSS教程: 双斜角横线菜单
- 下一个程序编程： CSS教程:6.2 项目列表
