css - 在一个复杂选择器中选择两个类

Question

给定两个长而复杂的选择器，例如

.question-number td:first-child > span[...]
.question-text td:first-child > span[...]

有没有办法将两者合并，使得长后缀不需要重复？类似的东西（尽管这不是有效的 CSS）

(.question-number | .question-text) td:first-child > span[...]

标签： css

Answer 1

如果您只有这两个包含单词question的类，您可以考虑如下属性选择器：

[class*=question] td:first-child>span {
  color: red;
}

<table>
  <tr class="anoher-class">
    <td><span>some text</span></td>
  </tr>
  <tr class="question-number">
    <td><span>some text</span></td>
  </tr>
  <tr>
    <td><span>some text</span></td>
  </tr>
  <tr class="question-text">
    <td><span>some text</span></td>
  </tr>
</table>