@import

Übersicht

Die @import CSS @-Regel wird verwendet, um Stilregeln anderer Stylesheets zu importieren. Diese Regeln müssen allen anderen Typen von Regeln vorangehen außer @charset Regeln; da sie kein verschachteltes Statement ist, kann @import nicht innerhalb bedingter Gruppen-@-Regeln verwendet werden.

Damit User Agents verhindern können, Ressourcen für nicht unterstützte Medientypen zu holen, können Autoren medienabhängige @import Regeln definieren. Diese bedingten Importe definieren kommaseparierte Media Queries nach dem URI. Falls keine Media Query angegeben wurde, ist der Import unbedingt. Die Angabe von all für das Medium hat denselben Effekt.

Syntax

@import url;
@import url list-of-media-queries;

wobei:

url

Ist ein <string> oder ein <uri>, der die Adresse der zu importierenden Ressource repräsentiert. Der URL kann absolut oder relativ sein. Beachte, dass der URL nicht unbedingt eine Datei referenzieren muss; er kann auch nur den Packagenamen und -teil angeben und die passende Datei wird automatisch ausgewählt (z. B. chrome://communicator/skin/). Siehe hier für mehr Informationen.

list-of-media-queries

Ist eine kommaseparierte Liste von Media Queries, die die Anwendung der in dem verlinkten URL definierten CSS Regeln bedingt. Falls der Browser keine dieser Media Queries unterstützt, lädt er die verlinkte Ressource nicht.

Formale Syntax

@import [ <string> | <url> ] [<media-query-list>]?;

Beispiele

@import url("fineprint.css") print;
@import url("bluish.css") projection, tv;
@import 'custom.css';
@import url("chrome://communicator/skin/");
@import "common.css" screen, projection;
@import url('landscape.css') screen and (orientation:landscape);

Spezifikationen

Browser Kompatibilität