CSS中的逗号，使用相同CSS的多个选择器

Question

.Resource table.Tbl td
{ /* some css*/ }

.Resource table.Tbl td.num
{ /* some css 2*/ }

.Resource table.Tbl td.num span.icon
{ /* some css 3*/ }

.Resource table.Tbl2 td
{ /* some css*/ }

.Resource table.Tbl2 td.num
{ /* some css 2*/ }

.Resource table.Tbl2 td.num span.icon
{ /* some css 3*/ }

其中Tbl和Tbl2的CSS应该相同。

.Resource table.Tbl, table.Tbl2 td { /* some css*/ }

不起作用。

如何在不重复整行的情况下实现这一目标？

Answer 1

.Resource table.Tbl td, .Resource table.Tbl2 td { /* some css*/ }

您应该为这两个规则添加完整的祖先路径。不只是你看到差异的地方。

Answer 2

.Resource table.Tbl td, .Resource table.Tbl2 td { /* some css */ }

您必须在table.TblX之前和之后复制这些内容，因为无法将,运算符分组为优先级高于后代选择器 。

Answer 3

你不能（不要在每个浏览器上阅读）。

不幸的是，每个选择器都是独立的。

这是CSS's annoying issues之一。

有:any()，可以按照您的意愿行事，但浏览器支持有限。

无论如何，您可以使用服务器端语言对其进行预处理，因此它会输出独立的选择器。

LESS很受欢迎。