Back to the index.
Selects elements that are later siblings of other elements.
Testsheet:
pre ~ p {color: #CB000F;}
The pre ~ p
selector means "each P element that is preceded by a PRE element", but, unlike
the pre + p
adjacent selector, the <pre>
element doesn't have to be the direct preceding element.
Therefore this paragraph, too, should be red. Although it's not directly preceded by a <pre>
,
the <pre>
is a general previous sibling.
This is a paragraph in a div. Since this paragraph doesn't have the <pre>
as a previous sibling
(it's more like an uncle; a previous sibling of this paragraph's parent node), it shouldn't be red.