有没有一种方便的方法可以组合后代选择器,而不会使空间混乱呢?
例如,我有两条规则:
上述代码无法正常工作,因为
例如,我有两条规则:
.details-recommendations-table th:nth-child(1) { /*rule*/ }
.details-recommendations-table td:nth-child(1) { /*rule*/ }
由于规则相同,而且描述了类中的一些td
和th
元素,将它们合并成一个会很方便。目前,我有以下内容:
.details-recommendations-table th:nth-child(1), .details-recommendations-table td:nth-child(1) { /*rule*/ }
但这只是通过重复父类的名称来混淆空间。有没有一种简洁的方法来结合这些规则,类似于以下内容:
.details-recommendations-table th:nth-child(1), td:nth-child(1) { /*rule*/ }
上述代码无法正常工作,因为
td:nth-child(1)
部分会传播到其他表格,即它不仅仅适用于 .details-recommendations-table
类中的 td
元素,这并不是预期的结果。
.details-recommendations-table span,.details-recommendations-table div
,转换为类似.details-recommendations-table <<span,div>>
的东西,其中<< >>
表示某种分组?编写.details-recommendations-table span,div
将使该规则适用于所有divs...我想要一种简洁的方法来清理样式表。而不使用less.js
来嵌套事物。 - Wojtek