在一个复杂的选择器中选择两个类

Question

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

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

是否有一种方法可以合并两者，而不必重复长的后缀？诸如此类（尽管这不是有效的CSS）

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

Answer 1

如果只有两个包含 question 单词的类，则可以考虑使用attribute selector，如下所示：

[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>