Как комбинировать селекторы

В CSS можно комбинировать селекторы для более точного выбора элементов. Основные способы:

1. Группировка — выбор нескольких элементов через запятую:

h1, h2, .title {
  color: blue;
}

2. Вложенность (пробел) — выбор элемента внутри другого:

nav a {
  text-decoration: none;
}

3. Дочерний селектор (>) — прямой потомок:

ul > li {
  list-style: none;
}

4. Соседний селектор (+) — следующий элемент:

h2 + p {
  margin-top: 0;
}

5. Общий соседний селектор (~) — все следующие элементы:

h2 ~ p {
  font-size: 14px;
}

Комбинируя селекторы, можно создавать точные и эффективные стили без лишних классов.