版权声明:随便转载 https://blog.csdn.net/a732894380/article/details/83306698
什么是盒模型?
可以说,页面就是由一个个盒模型堆砌起来的,每个HTML元素都可以叫做盒模型,盒模型由外而内包括:边距(margin)、边框(border)、填充(padding)、内容(content)。它在页面中所占的实际宽度是margin + border + paddint + content 的宽度相加。
但是,盒模型有标准盒模型和IE的盒模型。如果你打出来这两种,那么肯定会问两者的区别是什么?我们先来看两张图:
在这里插入图片描述
通过这两张图片我们可以很直观的看出两者的区别。不同之处就是标准盒模型的内容大小就是content的大小,而IE的则是content + padding +border 总的大小。
box-sizing:border-box; 这个代码可以把W3C的盒模型改成IE的盒模型。