重复标题选择器答案

【问题标题】：Repeated Heading Selectors重复标题选择器
【发布时间】：2013-04-05 00:56:32
【问题描述】：

随着最近推出的http://csslint.net，我开始质疑我过去构建样式表的一些方法。以下方法是我最近使用的一种：

/* Fonts */    
h1 { font-size:20px }
p  { font-size:12px }

/* Colors */
h1 { color:green }
p  { color:grey;
     background-color:white }

/* Margins */
h1 { margin:0 }
p  { margin:0 0 5px }

根据 linter 的说法，问题在于我一遍又一遍地重新声明标题选择器。原因当然是为了保持规则类型之间的逻辑分离。如果我想改变颜色，我会访问颜色区域。如果我想改变维度，我会访问维度区域。

CSSLint 是否担心我可能有覆盖样式的危险，从而浪费字符，或者是否存在与多少块有助于标题元素的整体呈现有关的性能问题？

这是一种不好的做法，还是只是一种误报？

【问题讨论】：

+1 只是为了快速试用 csslint！
不是每个人都同意 CSS Lint：mattwilcox.net/archive/entry/id/1054
@thirtydot 我知道这些观点，我在某些方面同意他们的观点。话虽如此，我仍然发现使用 Lint for CSS 的价值，因为它会发现一些错误。说到这样的项目，我就干脆按照我个人的判断，放弃CSSLint的规则吧。

标签： css performance css-selectors csslint

【解决方案1】：

无论哪种方式，都会为所有h1s 和所有ps 计算样式。与实际计算和渲染样式的同等可忽略的性能“影响”相比，选择器匹配的开销很小。

我猜你认为 CSS Lint 担心的是这种情况。事实上，我有点喜欢你自己组织样式的方式，除了不小心覆盖声明之外，没有发现任何其他问题。

【讨论】：

【解决方案2】：

来自他们的文档 -

标题元素应该在整个网站中具有一致的外观。

我认为这更多地与可用性/一致性而不是性能有关。一页大小为 20 像素，另一页大小为 14 像素的标题看起来不专业。

【讨论】：

我明白这一点，但我并没有违反这条规则。我在多个块中声明演示文稿的各个方面。大小设置一次，全局设置，边距设置一次，全局设置。问题是这两个规则都存在于两个不同的块中，这会引发有关重复选择器的警告标志。