在元素上使用单个css类和倍数是否有任何性能提升？
例如： -
<div class="single-class"></div>
VS
<div class="no-padding no-margin some-class some-other-class"></div>
答案 0 :(得分：15)
如果你有一个中等复杂的样式表并知道你正在做什么，使用多个类可以充分利用级联，这最终很可能意味着你赢得css文件会更小不要复制代码。因此，从这个意义上说，它实际上对性能有积极的影响（取决于你的css的复杂性）。
我试图想象一下如果jQuery UI样式表使用每元素一类的方法，它会是什么样子。我想它会增加一倍。
当然每个人都说，影响是如此之小，你不会注意到。继续使用多个类并拥抱级联！
FWIW，我真的不喜欢no-padding，float-left和ui-corner-all这样的班级名称。虽然它们对css作者有意义，但是每个声明结合多个元素的语义方法（以避免重复规则）几乎总是首选。使用第一种方法，如果您确定no-padding实际上需要1px填充，并且a.classname.float-left实际上需要向右浮动，那么您的CSS将毫无意义。
答案 1 :(得分：11)
从技术上讲，是更少的类意味着HTML的数据传输更少。就CSS而言，需要针对每个规则检查每个元素，因此根据您编写的规则，更少的类可能意味着更少的匹配。
差异很小，不易察觉。如果您使用成千上万的元素填充页面，您可能会注意到性能差异，但无论如何这将是一个糟糕的设计选择。
我所关注的一个问题是您提供的示例。您的课程no-padding，no-margin是样式的描述，这是一个坏主意。如果您的所有some-class元素都包含no-margin类，那么margin: 0应该是some-class规则的一部分。
不要为样式添加类，为类添加样式。
答案 2 :(得分：10)
基本规则适用于CSS，就像在其他语言中一样：除非遇到严重的实际性能问题或拥有数万个元素，否则不要担心此级别的优化。使用更具可读性的东西。
可能存在差异 - 从性能角度来看，使用CSS选择器通常非常不理想。但与其他因素相比，任何差异都将是微不足道的。