1.什么是盒子模型

       姑且将在页面上的各个元素看成一个盒子的竖切面，盒子里面有东西，那东西就是要呈现在页面能看的见得具体内容，这东西与纸板之间的距离就是内边距（padding），而这纸板就是这东西的边框（border），边框外与其他盒子外边距的距离就是外边距（margin）。

      （1）margin（外边距）：边框外的区域，到其他盒子外边距的距离，且外边距是透明的但可被背景色渲染

      （2）border（边框）：围绕在东西（内容）和内边距外的边框

      （3）padding（内边距）：东西（内容）与边框之间的区域，是透明的也可被背景色渲染

       （4）content（内容，也就是所谓的东西）：盒子的具体内容，显示文本或图像等

2.盒子模型的分类

       W3C 标准盒子模型&IE盒子模型

        标准盒子模型

            W3C标准模型中：

　　　　　　css的宽（width）=内容（content）的宽

                      css的高（height）=内容（content）的高

      IE盒子模型

                IE模型中：

　　　　　　css的宽（width）=内容（content）的宽+（border+padding）*2

                      css的高（height）=内容（content）的高+（border+padding）*2