[分享]css中box-sizing作用

CSS中的box-sizing属性是用来控制标准盒模型（content + padding + border）或怪异盒模型（content + border + padding + margin）中的盒子尺寸。通过设置box-sizing，我们可以更好地控制元素的宽度和高度。

下面是box-sizing的常见属性值：

box-sizing: content-box; /* 默认值，元素宽度和高度仅包含content部分 */
box-sizing: border-box; /* 元素宽度和高度包含content、padding、border部分，不计算margin */
box-sizing: inherit; /* 继承父元素的box-sizing属性值 */ 

对于使用border-box的盒子模型，在设置元素宽度和高度时，我们只需要考虑content部分，这样更方便，也更符合实际需要。不过需要注意，这种盒子模型下，padding和border的宽度会影响元素的实际尺寸，因此需要适当调整这些值。

需要注意的是，在不同浏览器中，盒子模型的默认值可能不同，最好在设置元素样式时，明确指定这一属性值，以确保效果一致。

总之，使用box-sizing属性可以更好地掌控元素的尺寸，使布局更加灵活和便捷。