在css中,盒子模型分为两种:标准模型和怪异模型
标准模型:总宽度=border+padding+内容区域宽度
怪异模型:总宽度=宽度,这个宽度就包括了border,padding和内容区域宽度
在标准模型中,border和padding都会撑大盒子,这对网页布局来说是灾难性的,因为会把其他元素挤开
而在怪异模型中,border和padding不会撑大盒子,而是把盒子往内挤,它会挤压缩小内容区域的宽高
转换标准模型:不用转换,默认就是标准模型
转怪异模型:box-sizing: border-box;