Комбинатор «+» в CSS выделяет только 1 последующий элемент, или несколько?

Подскажите, как точно работает комбинатор с знаком плюса, в одних руководствах пишется что он выделяет несколько элементов которые следуют сразу за "родителем", в других руководствах говорится что только один последующий элемент будет выделен. Или ни то ни другое?
  • Вопрос задан
  • 86 просмотров
Решения вопроса 2
rockon404
@rockon404
Frontend Developer
a ~ b – правые соседи: все b на том же уровне вложенности, которые идут после a.
a + b – первый правый сосед: b на том же уровне вложенности, который идёт сразу после a

В списках удобно задавать отступы между элементами комбинацией a + a:
.list-item + .list-item {
  margin-top: 10px;
}

sass версия:
.list-item {

  & + & {
    margin-top: 10px;
  }
}

это правило применит margin-top ко всем элеметнам списка кроме первого. Конечно, при условии что в списке все элементы будут иметь селектор .list-item:
<ul>
  <li class="list-item"></li>
  <li class="list-item"></li>
  <li class="list-item"></li>
  <li class="list-item"></li>
  <!--        ...         -->
  <li class="list-item"></li>
</ul>
Ответ написан
@givemoneybiatch
frontend
Только к тому, который идёт сразу после
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через TM ID
Похожие вопросы