@document
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 und befindet sich nicht auf dem Weg zur Standardisierung. Verwenden Sie sie nicht auf Produktionsseiten, die dem Web ausgesetzt sind: Sie funktioniert nicht für alle Benutzer. Es kann auch 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,pluginoderall. 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.