I can't seem to find much information about this.
Smashing Magazine seems to be saying that html
and :root
are the same thing but surely there must be a tiny difference?
The :root selector targets the highest level parent, which would be the <html> tag in an HTML document. The :root has a higher specificity, as it is a pseudo-class instead of a plain element.
The html element itself is "the root element" (which is the term given to the element which is the ancestor of all the other elements in the document), but this would be matched by html { } .
The CSS :root pseudo-class selector is used to select the highest-level parent of a given specification. In the HTML specification, the :root is essentially equivalent to the html selector.
The <html> HTML element represents the root (top-level element) of an HTML document, so it is also referred to as the root element.
From the W3C wiki:
The
:root
pseudo-class represents an element that is the root of the document. In HTML, this is always the HTML element.
CSS is a general purpose styling language. It can be used with other document types, not only with HTML, it can be used with SVG for example.
From the specification (emphasis mine):
This specification defines Cascading Style Sheets, level 2 revision 1 (CSS 2.1). CSS 2.1 is a style sheet language that allows authors and users to attach style (e.g., fonts and spacing) to structured documents (e.g., HTML documents and XML applications).
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With