css两种盒子模型和box-sizing

盒子从内到外主要由content、padding、border、margin组成

盒子模型我们通常分为两种：标准盒模型和IE盒模型

 

标准盒模型和IE盒模型的区别：

1.标准盒模型的宽高由content组成

2.IE盒模型的宽高由content、padding和border组成

 

box-sizing属性：

box-sizing是用来设置width、height取值范围的对象

他有三个值，分别是content-box 、 paading-box 、 border-box， 默认值是content-box，这也是我们设置元素宽度100%后再设置元素padding页面会出现滚动条的原因。

content-box是由content构成

padding-box是由content和padding构成

border-box是由content、padding和border构成