Что делает @-moz-document url-prefix()?

В Simon Collison новый отзывчивый веб-дизайн, в CSS есть несколько объявлений вроде этого:

@-moz-document url-prefix() {
  .fl { float:left; margin:12px 4px 0 0; padding:0; font-size:65px;  line-height:62%;  color:#ba1820; }
  .fs { float:left; margin:12px 4px 10px 0; padding:0; font-size:65px; line-height:62%; color:#ba1820; }
}

Что это на самом деле делает? Я googled для @-moz-document url-prefix() и нашел ссылки для его использования в userchrome, но не в стандартных таблицах стилей сайтов.

Обычно он имеет URL-адрес, переданный в качестве аргумента, который затем ограничивает содержимое объявления этим URL-адресом. Однако на сайте Colly не передается аргумент. Это означает, что объявление работает по текущему URL-адресу или любому URL-адресу, нет? Итак, - это то, что мы видим здесь, как ориентировать браузеры только для Mozilla с определенными правилами?

ОТВЕТЫ

Ответ 1

Любое правило CSS, начинающееся с @-moz-, является правилом Gecko-engine, а не стандартным правилом. То есть это расширение, зависящее от Mozilla.

Правило url-prefix применяет содержащиеся правила стиля к любой странице, URL которой начинается с нее. При использовании без аргумента URL, например @-moz-document url-prefix(), это относится ко всем страницам. Это эффективно CSS hack, используемое только для Gecko (Mozilla Firefox). Все остальные браузеры будут игнорировать стили.

См. здесь для списка других расширений, связанных с Mozilla.

Ответ 2

От https://developer.mozilla.org/en/CSS/@-moz-document

       @-moz-document url(http://www.w3.org/),
                   url-prefix(http://www.w3.org/Style/),
                   domain(mozilla.org)
    {
      /* 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 host is "mozilla.org" or ends with
           ".mozilla.org"
       */

      /* make the above-mentioned pages really ugly */
      body { color: purple; background: yellow; }
}

Ответ 3

Начиная с Firefox 59 вы должны просто использовать:

@document url("https://www.example.com/")

Поддержка версии -moz-prefixed этого свойства была остановлена ​​для веб-контента из-за ошибки:

https://bugzilla.mozilla.org/show_bug.cgi?id=1035091

Ответ 4

@supports (-moz-Appearance: none) {...} работал для меня в тех случаях, когда @-moz-document url-prefix() {...} не работал.