Выделить все элементы в подклассе

Question

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

Я представляю CSS как следующее (где часть :subtree - это что-то делать).

.diagram:subtree 
{ 
    ... 
} 

Когда я пишу HTML вроде следующего, должен быть выбран элемент <div> и каждый внутри него.

<div class="diagram"> 
    ... 
</div> 

Answer 1

Просто используйте descendant selector (пробел):

.diagram * { … } 

Это выбирает каждый элемент под любым элементом (ами), которые применили diagram класс.

Чтобы соответствовать как самого DIV и его потомки, использовать grouping:

.diagram, .diagram * { … } 

Цитирование спецификации:

Иногда авторы могут хотеть селекторы, чтобы соответствовать элементу, который является потомком другого элемента в дереве документов (например, «Совместить те элементы EM, которые содержатся элементом H1»). Селекторы потомков выражают такую ​​взаимосвязь в шаблоне. Селектор потомков состоит из двух или более селекторов, разделенных пробелом. Селектор потомков вида «А Б» совпадает, если элемент B является произвольным потомком некоторого предка элемента А.

Answer 2

просто использовать этот код для его .diagram * {}

Answer 3

.diagram, .diagram * 

Это будет выбрать DIV .diagram. Пространство - это селектор потомков, а * - все элементы.

EDIT: Я думал, что ваш вопрос изначально сказал «включая элемент», следовательно, .diagram,, но вы можете просто удалить его, если хотите.