CSS стили со стрелкой в пути

Чем отличаются стили CSS, когда указаны стрелки и без них.

Сравним два варианта стилей:

.main ul.navigation > .active > a {}
.main ul.navigation .active a {}

Стили в первой форме применяются конкретно к элементу a, который идет непосредственно в той очередности, в которой указано в стилях.

Например:

<div class="main">
    <ul class="navigation">
        <a href="">
            <li>

            </li>
        </a>
    </ul>
</div>

Во втором варинате стили применятся ко всем a внутри navigation, даже если между navigation и a будут промежуточные элементы:

<div class="main">
    <ul class="navigation">
        <li>
          <span>
            <a href="">

            </a>
          </span>
        </li>
    </ul>
</div>

Привет. Ты находишься на моём сайте. Я разработчик. Здесь я делюсь своими наработками и знаниями. Спрашивай в комментариях, если тебе что-то не понятно или пиши, если есть что добавить.

Если вам пригодилась информация, вы можете поблагодарить автора сайта символическим пожертвованием:

Добавить комментарий

Напишите свой комментарий, если вам есть что добавить/поправить/спросить по теме текущей статьи: "CSS стили со стрелкой в пути"
Если вам нужно добавить участок кода ставьте его между тегами <code></code>