Соседние селекторы
Соседними называются элементы веб-страницы, когда они следуют непосредственно друг за другом в коде документа. Рассмотрим несколько примеров отношения элементов.
<p>Lorem ipsum <b>dolor</b> sit amet.</p>
Тег <B> является дочерним по отношению к тегу <P>, поскольку он находится внутри этого контейнера. Соответственно <P> выступает в качестве родителя <B>.
<p>Lorem ipsum <b>dolor</b> <var>sit</var> amet.</p>
Теги <VAR> и <B> никак не перекрываются и представляют собой соседние элементы. То, что они расположены внутри контейнера <P>, никак не влияет на их отношение.
<p>Lorem <b>ipsum </b> dolor sit amet, <i>consectetuer</i> adipiscing <tt>elit</tt>.</p>
Соседними здесь являются теги <B> и <I>, а также <I> и <TT>. При этом <B> и <TT> к соседним элементам не относятся из-за того, что между ними расположен контейнер <I>.
Для управления стилем соседних элементов используется символ плюса (+), который устанавливается между двумя селекторами. Общий синтаксис следующий.
Селектор 1 + Селектор 2 { Описание правил стиля }
Пробелы вокруг плюса не обязательны, стиль при такой записи применяется к Селектору2, но только в том случае, если он является соседним для Селектора 1 и следует сразу после него.
Замечание
Соседние селекторы не поддерживаются браузером Internet Explorer.
В примере 10.1 показана структура взаимодействия тегов между собой.
