Группировка и Вёрстка

Группировка в CSS позволяет применять одинаковые стили к нескольким селекторам одновременно. Это помогает сократить код и сделать его более читаемым.

Синтаксис

selector1, selector2, selector3 {
  property: value;
}

Все перечисленные селекторы получат одинаковые свойства.

Пример

h1, h2, h3 {
  color: navy;
  font-family: Arial, sans-serif;
}

В этом примере заголовки h1, h2 и h3 будут иметь одинаковый цвет и шрифт.

Советы по вёрстке

  • Используйте группировку, чтобы уменьшить повторение кода.
  • При необходимости комбинируйте группировку с классами и ID для большей специфичности.
  • Следите за читаемостью кода: длинные списки селекторов лучше разбивать на несколько строк.

Пример комбинированного подхода

h1, h2, h3, .title {
  margin-bottom: 10px;
  color: darkgreen;
}

Здесь стили применяются к заголовкам и элементам с классом title.