基本元素框
所有文档元素都生成一个矩形框,这称为元素框(element box),它描述了一个元素在文档布局中所占的空间大小,因此,每个框影响着其他元素框的位置和大小。默认地,一个可以显示的文档由多个矩形框组成,这些矩形框分布开,从而不会相互重叠(一般情况下)。另外,根据某些限制,这些框要尽可能地少占空间,同时还要保证相互之间有足够的空间,以便清楚地看出哪些内容属于哪个元素。
外边距
没啥好说的,就说一点:
外边距使用百分数值时是以父元素宽度为标准的,上下外边距也一样。
边框
默认的边框颜色是元素本身的前景色。如果没有为边框声明颜色,它将与元素的文本颜色相同。另一方面,如果一个元素没有任何文本,假设它有一个表,其中只包含图像,那么该表的边框颜色就是其父元素的文本颜色(因为color可以继承)。
CSS2.1明确指出元素的背景是内容、内边距和边框区的背景。也就是说如果你的边框是虚线,背景会从边框中透出来。
边框的样式
border-style
[none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset]{1,4}| inherit
注意,当边框样式为none时,其width属性也会被置0。
内边距
可以为元素的内边距设置百分数值。像外边距一样,百分数值要相对于其父元素的width计算,上下边距也一样,所以如果父元素的width改变,它们也会改变。
替换元素
尽管看上去可能有些奇怪,不过确实可以向替换元素应用内边距,最让人奇怪的是,可以向图像应用内边距。
不论替换元素是块级元素还是行内元素,内边距都会围绕其内容,背景色将填入该内边距。