逃离HTML（七）

盒子模型

相信看到标题就肯定知道今天写什么了。没错，今天准备浅谈盒子模型。
盒子模型是当进行文档布局时，浏览器的某些插件根据css的一些规则将页面上的一个个元素都变成了一个个“盒子”。每个盒子都由一下几个部分组成：
内容（content）：相信这个我就可以不用过多赘述，可以理解成在盒子填充的东西。这个内容的长宽在某些元素内可以设置，但是在一些特定元素内不能设置。
边框（border）：其实边框这个属性，所以的元素都有，只是有部分元素在浏览器默认样式下没有显示出来。但是如果你设置了border属性的话，就一定能够表示出来。
内边距（padding）：内边距是指内容与边框之间的距离,他有四个属性，分别是：padding-left,padding-right,padding-top,padding-bottom。都是可以设置的，但是在某些元素内不能设置。待会儿再好好叙述一下。
外边距（margin）：外边距就是指盒子的边框与页面的距离，有四个属性，分别是：margin-left,margin-right,margin-top,margin-bottom。当然也可以用简写. margin:{1px,2px,3px,4px}其中从第一个值开始，分别是上外边距，右外边距，下外边距，左外边距。当然还有简写成margin{1px,2px,3px}代表上外边距为1px，左右外边距为2px，下边距为3px 。margin{1px}代表着所有的外边距都是1px margin{1px,2px} 代表着上下外边距是1px ，左右外边距是2px。

上图就是盒子模型最好的理解。
上面还说了一些元素不能设置宽高，现在我们来说一说有哪些元素不能设置宽高。所有的行内（级）元素都不能设置宽高。所有的块元素和行内块元素都可以设置宽高。