css盒模型是网页制作中用到的一种思维模型，网页中的元素都具有以下四个属性：
- 内容 content
- 内边距 padding
- 边框 border
- 外边距 margin
正常盒模型下，元素宽高不会包含内边距和边框，但是在IE盒模型下，给定元素一个宽高和内边距或边框，实际的内容宽高会被影响，也就是说IE盒模型下，宽高会包含width、height + 内边距 + 外边距
相同的一段样式，在两种盒模型下表现如下
input {
width: 48px;
height: 48px;
padding: 4px;
border: 2px solid red;
border-radius: 50%;
}
标准盒模型
怪异盒模型
宽度48，减去内边距和外边框之后内容区域只剩36
在实际开发场景中，如果我们遇到了预留出的宽高固定，不想元素受边距和边框的影响，可以通过box-sizing:border-box把标准盒模型改为怪异盒模型
