@document CSS at-rule
Veraltet: Diese Funktion wird nicht mehr empfohlen. Obwohl einige Browser sie möglicherweise noch unterstützen, könnte sie bereits aus den relevanten Webstandards entfernt worden sein, in Kürze entfernt werden oder nur noch aus Kompatibilitätsgründen bestehen. Vermeiden Sie die Verwendung und aktualisieren Sie vorhandenen Code, falls möglich; siehe die Kompatibilitätstabelle am Ende dieser Seite, um Ihre Entscheidung zu unterstützen. Beachten Sie, dass diese Funktion jederzeit aufhören könnte zu funktionieren.
Nicht standardisiert: Diese Funktion ist nicht standardisiert. Wir raten davon ab, nicht-standardisierte Funktionen auf produktiven Webseiten zu verwenden, da sie nur von bestimmten Browsern unterstützt werden und sich in Zukunft ändern oder entfernt werden können. Unter Umständen kann sie jedoch eine geeignete Option sein, wenn es keine standardisierte Alternative gibt.
Die @document CSS At-Regel schränkt die darin enthaltenen Stilregeln basierend auf der URL des Dokuments ein. Sie ist primär für benutzerdefinierte Stylesheets vorgesehen (siehe userchrome.org für mehr Informationen), kann jedoch auch in autoren-definierten Stylesheets verwendet werden.
Syntax
@document url("https://www.example.com/")
{
h1 {
color: green;
}
}
Eine @document-Regel kann eine oder mehrere passende Funktionen spezifizieren. Wenn eine der Funktionen auf eine gegebene URL zutrifft, wird die Regel auf diese URL angewendet. Die verfügbaren Funktionen sind:
url()-
Passt zu einer genauen URL.
url-prefix()-
Passt, wenn die Dokument-URL mit dem angegebenen Wert beginnt.
domain()-
Passt, wenn die Dokument-URL auf der angegebenen Domäne (oder einer Subdomäne davon) ist.
media-document()-
Passt das Medium entsprechend der Zeichenkette im Parameter an, eine von
video,image,pluginoderall. regexp()-
Passt, wenn die Dokument-URL durch den angegebenen regulären Ausdruck übereinstimmt. Der Ausdruck muss mit der gesamten URL übereinstimmen.
Die Werte, die den Funktionen url(), url-prefix(), domain() und media-document() übergeben werden, können optional in Einzel- oder Doppelkoten eingeschlossen werden. Die Werte für die Funktion regexp() müssen in Anführungszeichen eingeschlossen werden.
Escape-Werte, die der Funktion regexp() übergeben werden, müssen zusätzlich vor dem CSS escaped werden. Zum Beispiel passt ein . (Punkt) in regulären Ausdrücken auf jedes Zeichen. Um einen tatsächlichen Punkt zu matchen, müssen Sie ihn zuerst nach den Regeln für reguläre Ausdrücke escapen (zu \.) und dann diese Zeichenfolge nach CSS-Regeln escapen (zu \\.).
@document wird derzeit nur in Firefox unterstützt; wenn Sie diese Funktionalität in Ihrem eigenen Nicht-Firefox-Browser nachbilden möchten, können Sie versuchen, diesen Polyfill von @An-Error94 zu verwenden, der eine Kombination aus einem Benutzer-Skript, data-* Attributen, und Attributselektoren nutzt.
Hinweis:
Es gibt eine -moz-geprefixten Version dieser Eigenschaft — @-moz-document. Diese wurde in Firefox 59 in Nightly und Beta auf die Verwendung nur in Benutzer- und UA-Stylesheets beschränkt - ein Experiment, das entwickelt wurde, um potenzielle CSS-Injektionsangriffe zu mildern (siehe Firefox-Bug 1035091).
Formale Syntax
@document [ <url> |
url-prefix(<string>) |
domain(<string>) |
media-document(<string>) |
regexp(<string>)
]# {
<group-rule-body>
}
Beispiele
Spezifizierung eines Dokuments für CSS-Regel
@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
@document wurde ursprünglich in Stufe 3 eingeführt, wurde jedoch verschoben auf Stufe 4 und anschließend entfernt.
Browser-Kompatibilität
Siehe auch
- Seitenbezogene Benutzerstylesheet-Regeln auf der www-style Mailingliste.