Question

我有<div id='mydiv'>，我需要选择pre子项的所有div和#mydiv元素。

我可以这样做：

div#mydiv > pre, div#mydiv > div

但是，是否可以这样做#mydiv仅被引用一次？

div#mydiv > pre, div

将选择页面上的所有div，无论他们是#mydiv的孩子，因此逗号不是一种方法。也许还有另一种我不知道的语法？

Answer 1

您必须两次引用#mydiv ...

#mydiv > pre, #mydiv > div

我删除了无关的div元素选择器，因为ID足够具体。

Answer 2

据我所知，选择器分组没有简写。

请参阅“Selector Grouping”。

虽然使用LESS，但可以在“嵌套规则”部分中使用。

Answer 3

仅引用id一次的唯一方法是将其与*选择器一起使用：

#mydiv > * {

将适用于所有元素，即该div的子元素。

根据您计划应用的样式，这可能是可行的（我通常使用它来将边距，填充和边框样式清零），但它仍然可能是第一种方式，因为它使得更容易制作之后的例外/变化。

Answer 4

您实际上可以使用 :is() 对选择器进行分组。

所以在你的情况下，你会像这样使用它：

div#mydiv > :is(pre, div) {
     // CSS
}