是否可以简化以下 css 规则，这样我就不必为所有元素(td 和 th)复制类选择器 .simpleTable.cellBorders？
.simpleTable.cellBorders td, .simpleTable.cellBorders th {
border: 1px #ccc solid;
}
这个想法是，如果表格具有类 simpleTable 和 cellBorders 分配的类，则 td 和 th 单元格具有边框，如下所示:
<table class="simpleTable cellBorders">
<tr><th>My Header</th> ... </tr>
<tr><td>Some cell</td> ... </tr>
</table>
最佳答案
您当然可以将通用选择器 (*) 与子选择器 (>) 一起使用，因为除了 th 和 td 之外没有其他有效元素可以在 tr 中:
.simpleTable.cellBorders tr>* {
border: 1px #ccc solid;
}
请注意，在 .simpleTable.cellBorders 和 tr 之间放置另一个子选择器不会按预期工作，因为浏览器(至少是 Firefox)会添加一个 tbody 元素位于 table 元素及其 tr 元素之间，由 HTML 4.01 standard 定义以及 HTML5 standard :
Tag omission in text/html: A tbody element's start tag can be omitted if the first thing inside the tbody element is a tr element, and if the element is not immediately preceded by a tbody, thead, or tfoot element whose end tag has been omitted. (It can't be omitted if the element is empty.)
关于html - 如何使用多个类选择器为多个元素简化 css 规则，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16301704/