A + B

Оновлено: 09.01.2023

Сусідні селектори

Сусідні називаються елементи веб-сторінки, коли вони йдуть безпосередньо один за одним у коді документа.

Синтаксис 

E + F { Опис правил стилю }
Для керування стилем сусідніх елементів використовується символ плюса (+), який встановлюється між двома селекторами E та F. Пробіли навколо плюса не є обов'язковими. Стиль при такому записі застосовується до елемента F, але тільки в тому випадку, якщо він є сусіднім елементу E і слід відразу після нього. Розглянемо кілька прикладів. 
<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>Lorem <b>ipsum </b> dolor sit amet, <i>consectetuer</i> adipiscing <tt>elit</tt>.</p>

Сусідними тут є елементи <b> і <i>, і навіть <i> і <tt>. При цьому <b> і <tt> до сусідніх елементів не належать через те, що між ними розташований контейнер <i>.

Приклад

Результат цього прикладу показано на рис. 1.

Рис. 1. Червоний колір тексту для сусідніх селекторів

Примітка

Браузер Internet Explorer 7 не застосовує стиль, якщо між селекторами знаходиться коментар (B + /* плюс */ I).