Was ist der Unterschied zwischen CSS3 ist :root-Pseudoklasse und html?

Ich kann nicht scheinen, um herauszufinden, viele Informationen über diese.

Das Smashing Magazine scheint zu sagen, dass html und :root sind die gleiche Sache, aber sicherlich muss es einen kleinen Unterschied?

InformationsquelleAutor sanjaypoyzer | 2013-04-09
  1. 54

    Aus der W3C wiki:

    Den :root pseudo-Klasse repräsentiert ein element, das die Wurzel des Dokuments. In HTML immer das HTML-element.

    CSS ist eine Allzweck-Sprache styling. Es kann verwendet werden, mit anderen Dokument-Typen, nicht nur mit HTML, es kann verwendet werden, mit SVG zum Beispiel.

    Aus der Spezifikation (Hervorhebung von mir):

    Diese Spezifikation definiert Cascading Style Sheets, level 2 revision 1 (CSS 2.1). CSS 2.1 ist eine Stylesheet-Sprache, die es Autoren und Benutzern das Anhängen Stil (z.B., Schriftarten und Abstände) zu strukturierte Dokumente (z.B. HTML-Dokumente und XML-Anwendungen).

    • Danke, war nicht bewusst, dass man Stil SVGs mit CSS so. Akzeptierte Antwort für das zitieren der Quelle. 🙂
    • Nicht nur der SVG, sondern alles, was auf XML basiert. Einschließlich XHTML.
    InformationsquelleAutor Felix Kling
  2. 54

    Einen technischen Unterschied zwischen Ihnen ist, dass :root - eine pseudo-Klasse hat eine größere Spezifität als html (ein Typ-Selektor)

    CSS:

    :root {
  color: red
}
html {
  color: green;
}

    HTML:

    <div>hello world</div>

    So, in dem oben genannten Beispiel, die :root Selektor überschreibt die html - Selektor und der text wird rot.

    InformationsquelleAutor Danield
  3. 12

    Für HTML-Dokumente gibt es keinen Unterschied - Ihr root-element ist die <html> tag, so html{} und :root{} sind (abgesehen von einem Unterschied in der Spezifität) semantisch äquivalent.

    Allerdings können Sie CSS anzuwenden nicht nur für HTML, sondern für alle XML-Dokumente. Das ist, warum :root ist es - um auf die Dokument-root-element unabhängig von der Dokument-Typ. Die meisten Menschen sind verwirrt über den Unterschied, weil die überwiegend vorherrschende Verwendung für CSS styling, HTML-Dokumenten.

    Beispiel:
    Sie können den Stil der SVG-Dokumenten mit CSS. Beim styling ist es, Ihr root-element (offensichtlich;-)) nicht html aber svg. Finden Sie in der folgenden Liste SVG-tags.

    InformationsquelleAutor Christoph
Schreibe einen Kommentar