理解盒模型

DIV+CSS有两种盒模型浏览器

标准w3c盒模型spa

IE盒模型3d

如何让浏览器可以按标准盒模型来处理,就是在网页的顶部加上DOCTYPE声明。若是不加 DOCTYPE声明,那么各个浏览器会根据本身的行为去理解网页。blog

标准盒模型中width和height指的是内容区域的宽度和高度,增长内边距、边框和外边距不会影响内容区域的尺寸,可是会增长元素框的总尺寸;但在IE6浏览器的width不是内容的宽度,而是内容、内边距和边框的宽度总和。im

实际上IE的盒模型更加合理,w3c意识到了这个问题,从新定义盒模型是不可能的,因此在CSS3中,有这个属性:box-sizing,其有两个可选值,一个是默认的content-box一个是border-box,选用后者,盒模型将按IE6的方式进行处理。db

相关文章
相关标签/搜索