css3之box-sizing

简单记录，个人学习。

 

box-sizing:

 

 

•   content-box -------维持css2.1盒模型的组成模式，element width = border+padding+content

•   border-box  -------改变css2.1盒模型的组成模式，elemnet width = content

贴上两个图----资源来源于 http://chic.chicchina.net/shuxin/box-sizing.asp

 border-box下的width    ( 注释：发现图错了，宽高度还是200*70)
 content-box下的width

兼容性：

 

• -moz-box-sizing:border-box          Firefox(Gecko) 
• -webkit-box-sizing:border-box      Safari(Webkit) 3.0
• box-sizing:border-box                   Opera 7以上 |  IE8  |  IE9