At-Regel

At-Regel

Copyright © Shutterstock / one photo

Was ist die At-Regel?

Die At-Regel ist Bestandteil der Spezifikation von CSS (Cascading Style Sheets). At-Regeln sind Bestandteile vieler CSS-Dokumente, die eine Menge von CSS-Regeln einkapseln und auf etwas Spezifisches anwenden.

Sie können zum Importieren anderer CSS-Dateien, zum Anwenden von CSS auf ein bestimmtes Medium oder zum Einbetten von ungewöhnlichen Schriftarten verwendet werden. Jede At-Regel beginnt mit einem ApĂ©tail oder einem “At-Zeichen” – Daher diese Bezeichnung.

Eine At-Regel ist eine CSS-Anweisung, die die CSS anweist, sich in bestimmter Art und Weise zu verhalten. Sie beginnen mit einem at-Zeichen, gefolgt von einem Bezeichner und enthalten alles bis zum nÀchsten Semikolon oder dem nÀchsten CSS-Block, je nachdem, was zuerst eintritt.

Konkret sieht die allgemeine Struktur einer At-Regel wie folgt aus:
@IDENTIFIER (REGEL);

Die folgende At-Regel weist den Browser an, den Zeichensatz UTF-8 zu verwenden:
@charset “utf-8”;

Beispiele:

Es gibt eine Anzahl verschiedener solcher Regeln, jede At-Regel ist dabei durch ihren Bezeichner gekennzeichnet, jeweils mit einer anderen Syntax:

  • @charset – Definiert den vom Stylesheet verwendeten Zeichensatz.
  • @import – Weist die CSS-Engine an, ein externes Stylesheet einzubinden. Diese Regel wird ganz oben in der Datei eingefĂŒgt und weist das Stylesheet an, eine externe CSSDatei anzufordern und so einzubinden, als ob der Inhalt dieser Datei genau dort wĂ€re, wo sich diese Zeile befindet.
  • @namespace – Weist die CSS-Engine an, dass ihr gesamter Inhalt als PrĂ€fix mit einem XML-Namespace betrachtet werden muss.

Verschachtelte At-Regeln

Verschachtelte At-Regeln sind Teilmengen verschachtelter Anweisungen, die sowohl als Anweisung fĂŒr ein Stylesheet als auch innerhalb von bedingten Gruppenregeln verwendet werden können: Verschachtelte Regeln enthalten dann eine Teilmenge zusĂ€tzlicher Anweisungen, von denen einige möglicherweise von einer bestimmten Situation abhĂ€ngig sind.

  • @media – Eine bedingte Gruppenregel, deren Inhalt Anwendung findet, wenn das GerĂ€t die Kriterien der durch eine Medienabfrage definierten Bedingung erfĂŒllt.
  • @supports – Eine bedingte At-Regel, deren Inhalt angewendet wird, wenn der Browser die angegebenen Konditionen erfĂŒllt. Diese Gruppenregel prĂŒft, ob ein Browser ein Feature unterstĂŒtzt, und wendet dann die Stile fĂŒr diese Elemente an, wenn die Bedingung erfĂŒllt ist.
  • @document – Eine bedingte Gruppenregel, deren enthaltene Anweisungen in Kraft treten, wenn das Dokument, in dem das Stylesheet angewendet wird, die Kriterien der angegebenen Bedingung erfĂŒllt.
  • @page – Beschreibt LayoutĂ€nderungen, die beim Drucken des Dokuments angewendet werden.
  • @ font-face – Beschreibt eine externe Schriftart, die heruntergeladen werden soll.
  • @keyframes – Beschreibt den Aspekt von Zwischenschritten in einer CSS-Animationssequenz.
  • @viewport – Beschreibt die Adaption des Ansichtsfensters fĂŒr kleine BildschirmgerĂ€te.

At-Regel als bedingte Gruppenregeln

Ähnlich wie bei den Werten von Eigenschaften hat jede Regel eine andere Syntax. Dennoch können mehrere von ihnen einer speziellen Kategorie namens bedingte Gruppenregeln zugeordnet werden. Diese Anweisungen haben eine gemeinsame Syntax und jede von ihnen kann verschachtelte Anweisungen enthalten – entweder RegelsĂ€tze oder verschachtelte at-Regeln. DarĂŒber hinaus folgen sie alle einer gemeinsamen Semantik – sie sind alle mit einer Bedingung verbunden, die zu einem beliebigen Zeitpunkt entweder wahr oder falsch ist. Wenn die Bedingung als wahr ausgewertet wird, werden alle Anweisungen innerhalb der Gruppe angewendet. Die folgenden bedingten Gruppenregeln sind in CSS Conditionals Level 3 definiert:

  • @media
  • @supports
  • @document

Sie haben noch Fragen?

Kontaktieren Sie uns

Kostenloser SEO-Check der OSG


Weitere Inhalte