Question

而不是：

#1 span.error { color: #fff; }
#2  span.error { color: #fff; }

使用它是否更好/更快：

#1 span.error, #2 span.error { color: #fff; }

有没有办法缩短甚至更多？

我接受Ana的回答，但对我来说agam360首先击中了目标。谢谢大家

Answer 1

是的，我相信它更好 - 你避免冗余，如果你多次遇到这种情况，它可以大大减少CSS的大小。

更短的是将相同的类添加到两个ID中。类似的东西：

<div id="#1" class="myclass">
  <span class="error">error text 1</span>
</div>
<div id="#2" class="myclass">
  <span class="error">error text 1</span>
</div>

然后你可以写：

.myclass span.error {
  color: #fff;
}

如果您在具有ID span.error和#1 的元素之外没有任何#2元素，那么您可以将其进一步压缩为{{ 1}}

除此之外，如果具有类span.error { color: #fff; }的元素始终是.error元素，那么它们将成为<span>

所以你可以压缩多少东西真的取决于你的HTML结构。

Answer 2

取决于您网页的结构。

span.error { color: #fff; }会缩短它，或者如果祖先需要在规则中并遵循一种模式，你可以写一些div[id*='pattern'] span.error。在此示例中，祖先是div，其id包含文本“pattern”。您可以根据自己的需要进行修改。

CSS样式化多个ID

2 个答案: