css假定每个元素都会生成一个或多个矩形框,这称为元素框。各元素框中心有一个内容区。这个内容区周围有可选的内边距,边框和外边距。
W3C的标准盒模型
内盒尺寸计算(元素大小):
元素高度 = 内容高度 + 内边距 + 边框
元素宽度 = 内容宽度 + 内边距 + 边框
外盒尺寸计算(元素空间大小)
元素空间高度 = 内容高度 + 内边距 + 边框 + 外边距
元素空间宽度 = 内容宽度 + 内边距 + 边框 + 外边距
IE盒模型
内容大小:高=height-(border+padding)*2
宽=width-(border+padding)*2
实际大小:高=height+margin*2
宽=width+margin*2