建站知识

当前位置:首页 > 新闻资讯 > 建站知识 >

已阅读

css3中box-sizing是什么用法?

来源:admin       时间:2015-10-16 09:36         责任编辑:admin

IE8以下对于“盒模型”的解释: border 与 padding的宽度也计算包含在 width内了。但火狐,google等另一撮浏览器对标准的遵从,需要精确定义有限空间内显示的 box时,需要计算一下:留给它的空间只有那么大,刨去 border 和 padding,我们该把它的 width 写成多少?针对于此,css3下做了进一步改进,就是box-sizing 的属性的引入了。

它具有“content-box”和“border-box”两个值。 

定义 box-sizing: content-box; 时,浏览器对盒模型的解释遵从我们之前认识到的 W3C 标准; 

定义 box-sizing: border-box; 时,浏览器对盒模型的解释与 IE8以下相同(即border 与 padding的宽度也计算包含在 width内); 


用法:-moz-box-sizing,Safari / WebKit 请使用 -webkit-box-sizing,Opera 直接用 box-sizing