Das folgende Dokument beschreibt die Regeln, die für die Optimierung von CSS-Dateien in der Mozilla-Benutzeroberfläche gelten. Der erste Teil ist eine allgemeine Diskussion der Systemklassifizierungsregeln im Mozilla-Stil. Basierend auf diesem Systemverständnis finden Sie in den folgenden Abschnitten Richtlinien für Schreibstile, die sich die praktischen Vorteile dieses Stilsystems zunutze machen.
Das Stilsystem unterteilt Regeln in vier große Kategorien. Es ist wichtig, diese Klassen zu verstehen, da sie die ersten sind, die für den Regelabgleich berücksichtigt werden. In den folgenden Absätzen wird der Begriff „Primärselektor“ verwendet. Der primäre Selektor bezieht sich auf den äußersten rechten Teil des Selektors (das abzugleichende Element, nicht seine Vorgänger). Beispielsweise in der folgenden Regel:
a img, div > p, h1 + [Titel] {}
Die primären Selektoren sind „img“, „p“ und „[title]“.
Regeln, die den ID-Selektor als primären Selektor verwenden.
Zum Beispiel:
Wenn eine Regel eine bestimmte Klasse als primären Selektor hat, wird sie in diese Klasse klassifiziert.
Zum Beispiel:
Wenn der primäre Selektor nicht ID oder Klasse ist, ist die nächste Klasse wahrscheinlich die Tag-Kategorie. Wenn eine Regel ein Tag als Hauptselektor angibt, wird es dieser Kategorie zugeordnet.
Zum Beispiel:
Zusätzlich zu den oben genannten Kategorien fällt alles in diese Kategorie.
Zum Beispiel:
Das Stilsystem beginnt mit dem Selektor ganz rechts und bewegt sich nach links, um einer Regel zu entsprechen. Das Stilsystem vergleicht weiterhin Selektoren auf der linken Seite, bis die Regel erfüllt ist oder der Vergleich aufgrund eines Fehlers gestoppt wird.
Der erste Schritt bei der Klassifizierung von Regeln erfolgt basierend auf der primären Selektorkategorie. Der Zweck dieser Klassifizierung besteht darin, diejenigen Regeln herauszufiltern, die keinen zeitaufwändigen Abgleich erfordern. Hier liegt der Schwerpunkt erheblicher Leistungsverbesserungen. Je weniger Regeln für ein bestimmtes Element abgeglichen werden müssen, desto schneller wird der Stil gerendert. Wenn ein Element beispielsweise eine ID hat, werden nur ID-Regeln abgerufen, die mit der Element-ID übereinstimmen. Es werden nur Klassenregeln abgerufen, die mit der Klasse des Elements übereinstimmen. Es werden nur Tag-Regeln abgerufen, die mit dem Tag übereinstimmen. Globale Regeln werden immer abgerufen.