css2.1盒模型：
     当你定义盒子的宽高后；如果添加padding和border值后盒子的宽高会被撑大
     盒子的高度=定义的高度+(padding-top + padding-bottom)+(border-top + border-bottom);
     盒子的宽度=定义的宽度+(padding-left+ padding-right)+(border-left+ border-right);
css3.0盒模型：
       当你定义盒子高度后；如果添加padding和border值后盒子大小不会改变，他会向内容区收缩。
       盒子的高度=你定义的高度；盒子的宽度度=你定义的宽度；
用法：
   box-sizing：用来控制元素的盒模型解析模式
    box-sizing:content-box | border-box | inherit；
    默认值是content-box:维持w3c的标准盒模型 也就是css3.0以前的版本布局
    border-box：重新定义盒模型组成的模式。
    inherit：使元素继承父元素的盒模型模式。
    写法（考虑兼容）： 
         -moz-box-sizing: border-box;
         --webkit-box-sizing: border-box;
         -moz-box-sizing: border-box;
         -ms-box-sizing:border-box;
         box-sizing: border-box;
实例：
css3布局
页眉
左边栏
主内容
页脚
效果：