CSS3盒模型

CSS3盒子模型#

CSS3中可以通过 box-sizing 来指定盒模型，有2个值：可指定为 content-box 、 border-box ，这样计算盒子大小的方式就发生了改变。

可以分成两种情况：

1. box-sizing:content-box;盒子大小为width+padding+border(即之前默认的)
2. box-sizing:border-box;盒子大小为width

若盒子模型改为了box-sizing:border-box，那padding和border就不会撑大盒子了(前提padding和border不会超过width宽度)

box-sizing:content-box;

box-sizing:border-box;