重置CSS box-sizing：通用选择器与.box类[重复]答案

【问题标题】：Resetting CSS box-sizing: universal selector vs .box class [duplicate]重置CSS box-sizing：通用选择器与.box类[重复]
【发布时间】：2012-07-25 12:22:19
【问题描述】：

可能重复：
What is the performance impact of CSS's universal selector?

我在我的样式表中使用了box-sizing 属性，因为它使所有内容的布局变得更加容易。

我这样做的方法是制作布局class="box" 的所有基本元素，并将.box 类重置为border-box。我的理由是，最好的做法是尽可能具体。但我最近看到有人用这个：

* { 
    -webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box;   
    box-sizing: border-box;         
}

这是理想的，因为它会重置所有元素并采取 0 后端摆弄，但在性能方面会是一个坏主意吗？整个文档的通用选择器到底有多贵？

【问题讨论】：

值得一提的是，使用box-sizing 会破坏您在IE7 及更早版本中的网站。
值得一提的是，这在 IE8 中已经被破坏了（你没有包含 -ms- 前缀）。至于IE7及更早的@Spudley，你可以试试this polyfill。
@bfrohs 感谢您的提醒。我检查了一下，我认为 IE8 现在可以在没有 -ms- 的情况下接受它，但它可能仍然值得添加以防万一。 -- 至于 IE7 及更早版本...对于我自己的个人网站，我只是不打扰。对于其他任何事情，我现在一直在使用一个单独的更简单的样式表，因为我对旧浏览器的了解不够，无法弄清楚如何安抚他们的所有怪癖。
@fakaff，我多年来学到的一件事：人们不会更新软件。所以假设最坏的情况:)

标签： css performance user-interface

【解决方案1】：

就性能而言，通用选择器是您可以使用的最昂贵的选择器。

此处的基准：http://perfectionkills.com/profiling-css-for-fun-and-profit-optimization-notes/

但这就是说，这取决于您所说的“性能”是什么意思。如果您的网站明显变慢，除了样式表之外，可能还有其他原因，除非它们真的写得不好。

【讨论】：

因此，由于我从不使用它，看起来* 的一个实例应该不会对性能产生太大影响，对吧？ - 另外，我不知道从右到左的解析。这改变了我的很多成见。