你对padding属性的用法和作用是否了解,这里和大家分享一下,padding属性又包括四个属性padding-top、padding-right、padding-bottom、padding-left分别作用于上、右、下、左四边。 padding属性 1、语法:padding:lenght 2、参数: (1)lenght:由浮点数字和单位标识符组成的长度值或者百分数。百分数是基于父对象的宽度。请参阅长度单位 3、说明: 设置对象四边的内边距。默认值是0。 如果提供全部四个参数值,将按上、右、下、左的顺序作用于四边。 如果只提供一个,将作用于全部的四边。 如果提供两个,第一个作用于上、下,第二个作用于左、右。 如果提供三个,第一个作用于上,第二个作用于左、右,第三个作用于下。 内联对象要使用该属性,必须先设定对象的height或width属性,或者设定position属性为absolute。不允许负值。 内边距留白处总是透明的,并且设置内边距会直接影响对象的大小。 对应的脚本特性为:padding。 4、示例: 1. -//W3C//DTD XHTML 1.0 Transitional//EN" 2. 3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 4. http://www.w3.org/1999/xhtml"> 5. 6. Content-Type" content="text/html; charset=gb2312" /> 7.无标题文档 8. 30. 31. 32. 33.left"> 34. 这里是内容,对象中的内容到对象边缘的距离是PADDING。 35. 宽为270像素,高为175像素。但因为设置了内边距的上为30px, 36. 左为40px所以,要想保持原大小宽就必须减去40px,高减去30px。 37.38.right">39. 40. 5、提示 (1)由实例可以看出,设置了padding属性就相当于增加了对象的大小。原宽270px,高175px,设置padding:30px 0 0 40px后对象的大小应该是宽为310px,高为205px,要想保持原大小就必须减去相应的宽高。所以,例子中对象的宽是270-40=230px,高是175-30=145px。 (2)#right设置了padding:10px 0 0 10px,但其内联对象#sub_right的内边距并没有发生变化,所以padding也是不具有继承性的。 padding属性是可以分别设置的。 padding-top、padding-right、padding-bottom、padding-left分别作用于上、右、下、左四边。语法和参数和padding的设置相同。sub_right">子对象
padding属性的用法和作用
最新推荐文章于 2024-07-09 15:07:03 发布