box-sizing解决添加边框后尺寸变化问题

图二是我想要实现的效果，设置了和模板一样的width height但是实现的效果却是20×20
查了一下 发现是box-sizing的问题
box-sizing的CSS属性是用来改变默认的CSS框模型

box-sizing: content-box（默认样式） | padding-box | border-box

content-box，border和padding不计算入width之内

padding-box，padding计算入width内

border-box，border和padding计算入width之内，其实就是怪异模式了~
*,
*:before,
*:after {
box-sizing: inherit;
}

inherit规定应从父元素继承 box-sizing 属性的值
最后找按照终于发现在html设置了 怪异模式 修改过来就好了