html - 我可以在全局 box-sizing :border-box in my project? 中使用吗

标签 html css border-box box-sizing

<分区>


想要改进这个问题? 更新问题,以便 editing this post 可以用事实和引用来回答它.

关闭 7 年前

社区在 9 个月前 审查了是否重新打开这个问题,然后将其关闭:

原始关闭原因未解决

我可以在我的所有 murkup(所有元素)中使用 box-sizing: border-box; 吗?

例如:

html { 
   box-sizing: border-box; 
}, 
:before, *:after {
  box-sizing: inherit; 
}

因为更容易计算实际宽度,但是这种方法有什么缺点吗?

最佳答案

我通常将它应用到所有事情上。使用:

html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}

它使每个 g 变得更容易并且得到广泛支持。

https://css-tricks.com/international-box-sizing-awareness-day/

http://www.paulirish.com/2012/box-sizing-border-box-ftw/

编辑

同样值得注意的是,CSS 工作组认为这是 CSS 设计中的一个错误:

Box-sizing should be border-box by default.

https://wiki.csswg.org/ideas/mistakes

关于html - 我可以在全局 box-sizing :border-box in my project? 中使用吗,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35256279/

上一篇:javascript - css bootstrap slider 菜单修复

下一篇:html - 当提供非零无单位值(例如,底部)时,固定定位如何工作?

相关文章:

javascript - html5 canvas调整图片大小使用的算法是什么?

html - 这支笔的侧边栏在哪里?

html - 如何在 Sublime Text 中禁用自动完成(2&3)

html - 使用 Bootstrap 对齐水平下拉菜单

css - box-sizing - 'outline' 在 'border-box' 或 'content-box' 中计算?

html - 如果没有其他列,则使宽度为 9 的列填满整个宽度

html - 推特 Bootstrap : hiding a row-fluid container without the row's other containers to the right sliding left?

html - 如何使用 html 更改字体颜色?

使用 webkit 缩小时的 HTML 边框问题

css - 盒子大小 : border-box - Size not maintained if border is changed afterwards