mj-标准CSS盒模型和IE浏览器盒模型

简介：

CSS盒子模型又称为框模型，它里面包含了外边距margin，边框border，内边距padding，以及元素内容content。由内到外分别是从content，padding，border，以及margin。

标准盒模型和IE盒模型

标准盒模型的width为盒子中的content的宽度，通常设置背景时设置的是内容，内边距，边框。当边框为透明色时会显示background-color色彩。
元素框的宽高分别与content，padding，border，margin有关。
IE盒模型中的width为其中content，border，padding有关，元素框的宽高与width，margin有关。

box-sizing属性

css盒模型默认将对一个元素设置的width和height应用到这个元素的内容区，如果元素有边框和内边距值，绘制时就会加上。这样对响应式布局不友好，box-sizing属性可用来调整这些。
使用方法：{box-sizing：border-box；}

属性值	含义
content-box	默认属性，若元素宽为50px，则内容区有50px的宽，并且边框和内边距额宽度也会被增加到最后绘制出来的元素宽度中
border-box	告诉浏览器：设置的边框和内边距包含在width中，也就是说，内容区的实际宽度是width-border-padding

注意：当编写共享组件库时，谨慎使用这个属性，因为如果使用者网站没设置这个值，那么就很难使用这个组件库。这个属性不是继承属性。