What are CSS combinators? How many types of CSS combinators are there?
CSS Combinators
CSS combinators are symbols that explain the relationship between selectors. They allow you to target elements based on their relationship to other elements in the DOM hierarchy.
Types of CSS Combinators
Descendant combinator (space) – selects all elements that are descendants of a specified element. Example: `div p` selects all `<p>` inside `<div>`.
Child combinator (`>`) – selects elements that are direct children of a specified element. Example: `div > p` selects `<p>` directly inside `<div>`.
Adjacent sibling combinator (`+`) – selects an element that is immediately preceded by a specified sibling. Example: `h1 + p` selects the first `<p>` after an `<h1>`.
General sibling combinator (`~`) – selects all elements that are siblings of a specified element. Example: `h1 ~ p` selects all `<p>` siblings after `<h1>`.