当前位置：网站首页>box-sizing

box-sizing

2022-06-24 13:02:00 【snotJam】

box-sizing的默认值是content-box
表示这个元素所要渲染的区域是：
自己本身的宽高+padding的距离+margin的距离

如果设置值为：border-box
表示这个元素所要渲染的区域是指定的宽高，
设置的padding和margin都会在设置的宽高的范围内设置

在这里插入图片描述

如果我们使用了border-box，child宽度使用100%，会对宽度进行压缩
如果我们使用了border-box，child宽度使用100px，则不会进行压缩，就是把组件渲染完之后，没有剩余空间来绘制padding了

版权声明
本文为[snotJam]所创，转载请带上原文链接，感谢
https://blog.csdn.net/u010513497/article/details/125385625