CSS多个类/ id选择器？答案

【问题标题】：css multiple class / id selectors?CSS多个类/ id选择器？
【发布时间】：2015-04-30 04:31:26
【问题描述】：

我想知道如何编写一个适用于多个ids 或多个类的css 块：

类似：

.class1, .class2 {
 ...
}

或

#id1, #id2 {
 ...
}

我想知道如何处理这两种情况（希望是跨浏览器兼容的）。谢谢。

更新：为了更有趣，这也有效吗？

#id tr, #id2 tr {

}

【问题讨论】：

你的两个解决方案都是正确的......
哦，真的吗？我可以用逗号分隔它们吗？
是的，你可以。访问 w3schools 了解更多信息
你为什么不测试一下？
嗯，我没有太多不同的浏览器版本和品种需要确认，所以我想问问。

标签： css css-selectors

【解决方案1】：

你正在寻找这样的东西：

.oddBoxOut, 
.evenBoxOut {
  width: 12em;
  padding: 0.5em;
  margin: 0.5em;
  border: solid 1px black;
}

.oddBoxOut {
  float: left;
}

.evenBoxOut {
  float: right;
}

更新：

p#exampleID1 { background-color: blue; } 
p#exampleID2 { text-transform: uppercase; }

【讨论】：

对于我的更新，我实际上想在同一个块中选择它们：像 #id1 tr, #id2 tr {} 是这样吗？还是应该是：tr#id1, tr#id2{}？
按照记号tr#id1, tr#id2{}是对的没试过#id1 tr, #id2 tr {} 这个

【解决方案2】：

对于你的更新也是有效的，

#id1 tr {

}

表示节点 ID #id1 的每个 child 都将被 CSS 处理。

你也可以这样做

tr#id1 {

}

如果 id == #id1，则只有 tr 会受到影响

【讨论】：