盒模型及IE盒模型中的bug

盒模型

在网页制作中,css盒模型是div布局的核心,每个元素都是以块的形式来展现。在CSS中,它将页面中的每一个段落、标题、图片等元素都看成是一个装在盒子里的东西,也就是盒子里的内容。比较让人好理解一些的一个比喻是一个大纸盒子里装了一块方形的面包,面包就是一个段落、一个标题或者一幅图片,面包比盒子要小一些。面包的边缘到盒子侧边的距离就是CSS中的内边距属性(Padding),盒子的侧面四个边形成的边框就是CSS中的Border属性,而一个网页中有很多段落、标题、图片,也就是有很多这样的盒子,这些盒子和盒子之间的距离就是CSS中的外边距属性(margin)。它的计算方式如下图所示:

未完,继续阅读