css:combinators
Table of Contents
CSS: Combinators
Adjacent Sibling
The adjacent sibling combinator (+) separates two selectors and matches the second element only if it immediately follows the first element, and both are children of the same parent element.
/* Paragraphs that come immediately after any image */ img + p {}
Child
The child combinator (>) is placed between two CSS selectors. It matches only those elements matched by the second selector that are the direct children of elements matched by the first.
/* List items that are children of the "my-things" list */ ul.my-things > li {}
General Sibling
The general sibling combinator (~) separates two selectors and matches all iterations of the second element, that are following the first element (though not necessarily immediately), and are children of the same parent element.
/* Paragraphs that are siblings of and subsequent to any image */ img ~ p {}
css/combinators.txt · Last modified: by linepup
