box-sizing属性用于控制元素尺寸计算方式，content-box下宽高不包含内边距和边框，border-box则包含，推荐全局设置为border-box以统一布局行为。
在CSS中，box-sizing 属性用于控制元素的盒模型计算方式，改变元素的宽度和高度如何包含内容、内边距（padding）和边框（border）。
默认的盒模型：content-box
默认情况下，所有HTML元素使用 box-sizing: content-box。这意味着你设置的 width 和 height 只包括内容区域，不包括 padding 和 border。例如：width: 200px;
padding: 20px;
border: 5px solid black;
更直观的盒模型：border-box
将 box-sizing 设置为 border-box 后，元素的 width 和 height 包括了内容、padding 和 border。例如：box-sizing: border-box;
width: 200px;
padding: 20px;
border: 5px solid black;
如何全局设置 box-sizing
为了简化样式管理，通常建议在项目开始时将所有元素设为 border-box：* {
box-sizing: border-box;
}
基本上就这些。通过调整 box-sizing，你可以更灵活地控制元素的实际尺寸表现，推荐在新项目中默认使用 border-box。
