Сусідній брат чи сестра - CSS-хитрощі

Зміст:

Сусідній комбінатор братів і сестер у CSS - це не селектор сам по собі, а спосіб поєднання двох селекторів. Наприклад:

p + p ( margin: 0; )

Знак плюс (+) - сусідній комбінатор братів та сестер між двома селекторами тегів абзаців (елементів). Це означає «вибрати будь-який тег абзацу, який знаходиться безпосередньо після іншого тегу абзацу (без проміжків)». Ось кілька прикладів того, що він би вибрав:


I'm a paragraph
I get selected!
I'm a paragraph

Monkey hair
I will NOT get selected

Це в основному корисно, коли використовується семантична розмітка та необхідність коригування для певних сценаріїв, коли елементи знаходяться безпосередньо поруч.

Дивіться Селектор вибору сусідніх ручок Сари Коуп (@saracope) на CodePen.