同学你好,怪异盒模型也包括margin、border、padding、content,不过,和标准盒子模型不同的是:怪异盒模型的宽包含了border和padding。
我们可以和标准盒模型进行一个对比;标准盒模型自身大小为 content(内容),padding(内外边距),border(边框) 实际大小为content+padding+margin+border。
我们可以举个小例子:给一个盒子设置相应的属性;


在第一阶段盒模型的视频中已经讲了box-sizing:border-box;这个属性:

通过这个属性可以将标准盒模型转换为怪异盒模型:

此时的宽度,包含了border+padding+content,因此我们可以总结出:标准模式会被设置的padding撑开,而怪异模式则相当于将盒子的大小固定好,再将内容装入盒子,盒子的大小并不会被padding所撑开。
祝学习愉快~
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星