盒模型原理

 盒模型原理: 对所有的盒子在浏览器所占据的[空间]进行计算

        盒子: 在要在浏览器中 [占据位置]的html元素: 都是我们计算的盒子 

             可以包括 inline  inline-block   block

            盒模型使用什么计算盒子在浏览器中占据的位置

            width height padding border-width margin

 

            盒子分类: 边框盒子ie   和内容盒子 谷歌

 

            边框盒子在浏览器占据空间 = width x height

            内容盒子在浏览器中占据的空间 = width+border-width+padding+height+margin

 

            结论: 内容盒子: width height 决定 盒子能容纳多少东西  随着其他变化  盒子在浏览器中占据的位置也变化

                 边框盒子: width height 决定盒子在父容器中占据的位置  其他变化只会改变盒子能容纳多少东西