css3 box-sizing属性

box-sizing属性可以为三个值之一：content-box（default），border-box，padding-box。

content-box，border和padding不计算入width和height之内，浏览器默认也是这样

padding-box，padding计算入width内

border-box，border和padding计算入width之内，其实就是怪异模式了~

 

ie8+浏览器支持content-box和border-box；

ff则支持全部三个值。

 

案例

        #a1
        {
            width:500px;
            padding: 10px;
            border:1px solid #ee240f;
        }

问题：对于样式#a1,我们想让元素显示为宽度为500px，box-sizing=？

答案：box-sizing：border-box;