@document
Veraltet: Diese Funktion wird nicht mehr empfohlen. Obwohl einige Browser sie möglicherweise noch unterstützen, kann sie bereits aus den relevanten Webstandards entfernt worden sein, befindet sich im Prozess der Entfernung oder wird nur aus Kompatibilitätsgründen beibehalten. Vermeiden Sie die Verwendung und aktualisieren Sie gegebenenfalls bestehenden Code; siehe die Kompatibilitätstabelle am Ende dieser Seite, um Ihre Entscheidung zu treffen. Beachten Sie, dass diese Funktion jederzeit nicht mehr funktionieren kann.
Kein Standard: Diese Funktion ist nicht standardisiert und befindet sich nicht im Standardisierungsprozess. Verwenden Sie sie nicht auf Produktionsseiten, die auf das Web ausgerichtet sind: Sie wird nicht für alle Benutzer funktionieren. Außerdem kann es große Inkompatibilitäten zwischen Implementierungen geben und das Verhalten kann sich in Zukunft ändern.
Die @document
CSS At-Regel beschränkt die darin enthaltenen Stilregeln basierend auf der URL des Dokuments. Sie ist in erster Linie für benutzerdefinierte Stylesheets gedacht, kann aber auch in autordefinierten Stylesheets verwendet werden.
@document url("https://www.example.com/")
{
h1 {
color: green;
}
}
Syntax
Eine @document
-Regel kann eine oder mehrere passende Funktionen angeben. Wenn eine der Funktionen auf eine gegebene URL zutrifft, wird die Regel auf diese URL angewendet. Die verfügbaren Funktionen sind:
url()
-
Passt auf eine genaue URL.
url-prefix()
-
Passt, wenn die Dokument-URL mit dem angegebenen Wert beginnt.
domain()
-
Passt, wenn die Dokument-URL auf der angegebenen Domain (oder einer Subdomain davon) liegt.
media-document()
-
Passt auf Medien gemäß der im Parameter angegebenen Zeichenfolge, eines von
video
,image
,plugin
oderall
. regexp()
-
Passt, wenn die Dokument-URL mit dem angegebenen regulären Ausdruck übereinstimmt. Der Ausdruck muss die gesamte URL abdecken.
Die zu den Funktionen url()
, url-prefix()
, domain()
und media-document()
gegebenen Werte können optional in einfachen oder doppelten Anführungszeichen stehen. Die zu der Funktion regexp()
gegebenen Werte müssen in Anführungszeichen stehen.
Escape-Werte, die der Funktion regexp()
gegeben werden, müssen zusätzlich aus dem CSS heraus escapen werden. Beispielsweise entspricht ein .
(Punkt) in regulären Ausdrücken jedem Zeichen. Um einem tatsächlichen Punkt zu entsprechen, müssten Sie ihn zunächst gemäß den Regeln der regulären Ausdrücke escapen (zu \.
) und dann diesen String gemäß den CSS-Regeln escapen (zu \\.
).
@document
wird derzeit nur in Firefox unterstützt; wenn Sie versuchen möchten, eine solche Funktionalität in Ihrem nicht-Firefox-Browser zu replizieren, können Sie dieses Polyfill von @An-Error94 verwenden, das eine Kombination aus einem Nutzer-Skript, data-* Attributen, und Attributselektoren verwendet.
Hinweis: Es gibt eine -moz-präfixierte Version dieser Eigenschaft — @-moz-document
. Diese wurde in Firefox 59 auf Nightly und Beta darauf beschränkt, nur in Benutzer- und UA-Sheets verwendet zu werden — ein Experiment, das darauf abzielt, potenzielle CSS-Injektionsangriffe abzuschwächen (siehe Firefox Fehler 1035091).
Formale Syntax
@document [ <url> | url-prefix(<string>) | domain(<string>) | media-document(<string>) | regexp(<string>) ]# { <group-rule-body> }
Beispiele
Dokument für CSS-Regel angeben
@document url("http://www.w3.org/"),
url-prefix("http://www.w3.org/Style/"),
domain("mozilla.org"),
media-document("video"),
regexp("https:.*") {
/* CSS rules here apply to:
- The page "http://www.w3.org/"
- Any page whose URL begins with "http://www.w3.org/Style/"
- Any page whose URL's host is "mozilla.org"
or ends with ".mozilla.org"
- Any standalone video
- Any page whose URL starts with "https:" */
/* Make the above-mentioned pages really ugly */
body {
color: purple;
background: yellow;
}
}
Spezifikationen
Ursprünglich in Level 3 vorgesehen, wurde @document
verschoben auf Level 4, aber dann letztendlich entfernt.
Browser-Kompatibilität
BCD tables only load in the browser
Siehe auch
- Regeln für benutzerdefinierte Stylesheets pro Website in der www-style Mailing-Liste.