css3 box-sizing属性

Posted 漫思

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了css3 box-sizing属性相关的知识,希望对你有一定的参考价值。

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;

 

 

以上是关于css3 box-sizing属性的主要内容,如果未能解决你的问题,请参考以下文章

css3 box-sizing属性

css3 box-sizing属性

CSS3 box-sizing属性

box-sizing是css3的新属性吗

css3——box-sizing属性

box-sizing