CSS样式多个ID的

Question

，而不是这样的：

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

是更好/更快速地使用：

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

有没有一种办法，甚至更短？

我接受安娜的回答，但对我来说，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; 
} 

如果没有外界有IDS #1和#2元素任何span.error元素，那么你可能会进一步压缩这只是span.error { color: #fff; }

如果，除此之外，具有类别.error的元素总是<span>元素，他们凸轮变成.error { color: #fff; }

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

Answer 2

取决于您的页面结构。

span.error { color: #fff; }会缩短它更多，或者如果祖先需要遵守规则并遵循一种模式，您可以写这样的东西div[id*='pattern'] span.error。 在这个例子中，祖先是一个div，它的id包含文本“pattern”。您可以修改它以符合您的需求。