1 border-box

box 包含四部分：content，padding，border，margin
当box-sizing 设置成border-box时
此时设置该div的width = content.width+padding.width+border.width

*{
box-sizing:border-box;
}
div{
border:20px solid red;
width:200px;
height:200px;
}


image.png

*{
box-sizing:border-box;
}
div{
    border:20px solid red;
    width:0px;
    height:0px;
}

此时，按道理说，width=0了，应该看不到该div
但是现实结果出乎意料

image.png

这个div是完全由border撑起来的，这时候只考虑border的width，不考虑width