Как выбрать несколько элементов, являющихся дочерними элементами данного элемента?

У меня есть <div id='mydiv'>, и мне нужно выбрать все элементы pre и div, которые являются дочерними элементами #mydiv.

Я мог бы сделать это следующим образом:

div#mydiv > pre, div#mydiv > div

но можно ли это сделать так, чтобы #mydiv ссылался только один раз?

div#mydiv > pre, div

выберет все div на странице, независимо от того, являются ли они дочерними элементами #mydiv, поэтому запятая не способ сделать это. Может быть, есть другой вид синтаксиса, о котором я не знаю?

Ответ 1

Вам придется дважды ссылаться на #mydiv...

#mydiv > pre, #mydiv > div

Я удалил посторонний селектор элементов div, поскольку идентификатор достаточно определен.

Ответ 2

Насколько я знаю, для селекторной группировки нет сокращений.

См. "" Селекторная группировка".

Хотя, LESS, это возможно в разделе "Вложенные правила".

Ответ 3

Единственный способ ссылаться на идентификатор только один раз - использовать его с селектором *:

#mydiv > * {

который будет применяться ко всем элементам, являющимся дочерними элементами этого div.

В зависимости от того, какие стили вы планируете применять, это может быть работоспособным (я обычно использую это для выравнивания полей, отступов и стилей границ), но, вероятно, лучше всего сделать это первым способом, поскольку это упрощает создание исключения/изменения позже по дороге.