在大多数情况下我们在设置元素的 border
和 padding
并不希望改变元素的 width,height
值,这个时候我们就可以为该元素设置 box-sizing:border-box;
。
我不希望每次都重写一遍,而是希望他是继承而来的,那么我们可以使用如下代码:
html {
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: inherit;
}
这样的好处在于他不会覆盖其他组件的 box-sizing
值,又无需为每一个元素重复设置 box-sizing:border-box;
。