@document
Экспериментальная возможность: Это экспериментальная технология
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.
CSS @-правило @document
ограничивает правила стиля, содержащиеся в нем, на основе URL-адреса документа. Он разработан в основном для пользовательских таблиц стилей, хотя он также может использоваться в авторских таблицах стилей.
@document url("https://www.example.com/")
{
h1 {
color: green;
}
}
Синтаксис
Правило @document
может указывать одну или несколько подходящих функций. Если какая-либо из функций применяется к данному URL-адресу, это правило вступит в силу для этого URL-адреса. Доступны следующие функции:
url()
, который соответствует точному URL-адресу.url-prefix()
, который совпадает, если URL-адрес документа начинается с указанного значения.domain()
, который совпадает, если URL-адрес документа находится в предоставленном домене (или его субдомене).media-document()
,с параметром видео, изображения, плагина или всего.regexp()
, который совпадает, если URL-адрес документа сопоставляется с предоставленным регулярным выражением. Выражение должно соответствовать всему URL-адресу.
Значения, предоставляемые функциям url()
, url-prefix()
, domain()
, и media-document()
могут быть необязательно заключены в одинарные или двойные кавычки. Значения, предоставляемые функции regexp()
должны быть заключены в кавычки. .
Экранированные значения, предоставляемые функции regexp()
также должны быть экранированы из CSS. Например, .
(период) соответствует любому символу в регулярных выражениях. Чтобы соответствовать буквальному периоду, вам сначала нужно избежать этого, используя правила регулярных выражений (\.
), А затем убежать от этой строки с помощью правил CSS (\\.
).
Примечание: Существует версия -moz-prefixed этого свойства — @-moz-document
. Это было ограничено использованием только в пользовательских и UA-листах в Firefox 59 в Nightly and Beta - эксперименте, предназначенном для смягчения потенциальных атак с помощью CSS-инъекций (Firefox bug 1035091).
Формальный синтаксис
Пример
CSS
@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;
}
}
Спецификации
Initially in CSS Conditional Rules Module Level 3, @document
has been postponed to Level 4.
Совместимость с браузерами
BCD tables only load in the browser
Смотрите также
- Per-site user style sheet rules on the www-style mailing list.