комбинация

Вам не обязательно повторять несколько селекторов с одинаковыми атрибутами, вам просто нужно разделить селекторы запятыми (,).

Например, у вас есть следующий код:

h2 { цвет: красный }

.thisOtherClass { цвет: красный }

.yetAnotherClass { цвет: красный }

Тогда вы можете написать:

h2, .thisOtherClass, .yetAnotherClass { цвет: красный }

Используя композицию, вы можете определить несколько CSS одновременно, сэкономив много байтов и времени.

Вложенный

Если CSS хорошо структурирован, нет необходимости использовать слишком много классов или селекторов идентификаторов. Это связано с тем, что вы можете указать селекторы внутри селекторов. (Или лучше сказать, селектор контекста - переводчик)

например:

#top { цвет фона: #ccc прописка: 1em }

#top h1 { цвет: #ff0 }

#top p {цвет: красный; шрифт-вес: жирный};

Это исключает ненужные селекторы классов или идентификаторов, если применять их к HTML следующим образом:

Это связано с тем, что, используя английские селекторы, разделенные полушириной пробелом, мы указываем, что h1 в идентификаторе ID имеет цвет «#ff0», а p — красный и жирный.

Это также может быть немного сложнее (так как может быть более двух уровней, например, внутри внутри внутри внутри внутри и т. д.). Вам нужно больше практиковаться.

Использование вложенности может сделать ваш CSS-код более понятным и настроить CSS для указанных вами элементов.