HuntExams Academy
HTML/CSSIntermediate#css#selectors

What is the difference between adjacent sibling (+) and general sibling (~) combinators?

+ selects only the immediately following sibling, while ~ selects all following siblings matching the selector, regardless of how far apart they are, as long as they share the same parent.

Example
h2 + p { font-weight: bold; }   /* only the paragraph right after an h2 */
h2 ~ p { color: gray; }         /* every paragraph after an h2 at the same level */

Related Questions

1
HTML/CSSBeginner#css#transitions

How do CSS transitions work?

Open
2
HTML/CSSIntermediate#css#animations

How do CSS keyframe animations work?

Open
3
HTML/CSSIntermediate#css#transforms

What CSS transform functions are commonly used?

Open