box-sizing

盒子模型（外层的margin只是为了理解）

盒子的宽度 = padding2 +border2+width
盒子的高度 = padding2+border2+width
这样我们每次在设置一个盒子的时候都需要去计算padding、border。并不直观，box-sizing 就解决了这个问题

box-Sizing

语法：box-sizing: content-box | border-box | inherit;
实例讲解
.div{
width:200px
box-sizing:content-box
}
此时200px就只是contentWidth，盒子的宽度=padding2+border2+200px

.div{
width:200px
box-sizing:border-box
}
此时盒子的宽度就是200px,200px=padding2+border2+contentWidth;

inherit
描述：继承 父元素 box-sizing属性的值