box-sizing:border-box一般用在什么情况下呀

Answer 1

当你设置一个元素为 box-sizing: border-box; 时，此元素的内边距和边框不再会增加它的宽度。

例如：

<div class="box">举个例子</div>

.box {  

    width: 500px;     

    height:100px;  

    border: 1px solid #000;

    -webkit-box-sizing: border-box;     

        -moz-box-sizing: border-box;

                  box-sizing: border-box;

}

如果这时候你加上一个内边距属性，padding: 10px;

这个div不会撑开，即你所见的边框位置没有任何变动，但是“举个例子”这句话会和div边框有10px的间距。

一般在写页面的时候用这个属性就不会再考虑边框和内边距会改变整体所占宽度，即不用再根据盒子模型再去计算，省去很多麻烦。

Answer 2

这个一般在做自适应的网页设计的时候用呀，用这个属性网页结构才不会被破坏，希望可以帮到你

Answer 3

box-sizing:border-box 这是怪异盒模型

当用 IE6 和 IE7 浏览器打开代码时使用.