今天我们来说一下盒模型

当你设置了元素的宽度，但是实际展示的宽度却超过了你设置的宽度。两个盒子都设置了2个像素的边框，所以实际上两个盒子在网页上展示的宽度要比设置的宽度大（图中第一个盒子的宽度为504px）。下面的第二个盒子，由于设置了上右下左的内边距为20px，所以第二个盒子的宽度为544px（宽度为500px，左右内边距加起来40px，左右分别2px的边框）。

如果想让设置的宽度一样的话，那就需要开发者在宽度的基础上减去内边距和边框的宽度，上图的话可以这样设置：第一个盒子宽度设置为496px，第二个盒子的宽度设置为456px，这样设置的话宽度就是一样的了，不过这样设置的话很麻烦不便于维护。