Receive daily AI-curated summaries of engineering articles from top tech companies worldwide.
Endigest AI Core Summary
This article explores the various CSS selectors that can target the <html> element, ranging from practical to purely academic.
•The `html` type selector and `:root` pseudo-class both select the root element, but `:root` has higher specificity (0-1-0 vs 0-0-1) and is conventional for declaring global custom properties.
•`:scope` semantically matches the global scope root (<html>) outside of an `@scope` block, making it an alternative to `:root` for CSS custom properties.
•The `&` selector, when used outside of CSS nesting and outside an `@scope` block, defaults to selecting the scope root (<html>).
•`:has(head)` and `:has(body)` uniquely identify <html> because no other element is permitted to contain <head> or <body> as direct children per HTML spec.
•
`:not(* *)` selects any element not contained by another element, which by definition can only be <html>, the sole element with no parent.
This summary was automatically generated by AI based on the original article and may not be fully accurate.
CSS-Tricks
WebKit