盒模型

盒子模型有几种，它们之间有什么区别。
一、标准盒模型（W3C）
1.给标签添加：box-sizing:content-box；(元素默认)
2.这个标签就转换为了标准盒模型
3.标签得实际宽度 = 设置的宽度 + border宽度 + padding的宽度

二、IE盒模型（怪异）
1.给标签添加：box-sizing:border-box；
2.这个标签就转换为了怪异盒模型
3.标签得实际宽度 = 设置的宽度
4.如果设置了padding和border就是从设置的实际宽高中减去，减去后才是内容的宽高。

主要区别：对于宽高的二者定义不同

标准盒模型：设置的宽度就等于内容的宽度
IE盒模型：内容的宽度 = 设置的宽度 - border的宽度 - padding的宽度
————————————————
版权声明：本文为CSDN博主「程序员不懂浪漫」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/AI__NB/article/details/121685361