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

85

В новом старом адаптивном веб-дизайне Саймона Коллисона в 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; }
}

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

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

css firefox browser Чарльз Ропер
источник

Ответы:

97

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

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

См. Здесь список других расширений для Mozilla.

Одед
источник
Я немного расширил вопрос, потому что не понял ключевого момента. Я интуитивно догадался, что вы здесь написали, но был озадачен отсутствием аргументов. Хотя, думаю, я понял это.
Чарльз Ропер
У меня проблемы с интервалом между буквами в Mozilla для определенного шрифта. (т.е. простое). В chorme он отображается нормально, но в firefox он отображается немного шире. поэтому я хочу уменьшить расстояние между буквами в Firefox, но не в Chrome. Я не могу найти такое расширение moz для межбуквенного интервала.
Яш Векария 06
1
@YashVekaria Это не будет расширение moz, вы должны использовать свойство CSS. @-moz-document url-prefix() { .your-class { letter-spacing: 2em; } }
Stout Joe
17

Из 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's host is "mozilla.org" or ends with
           ".mozilla.org"
       */

      /* make the above-mentioned pages really ugly */
      body { color: purple; background: yellow; }
}
Белла
источник
5

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

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

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

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

Адам
источник
@jaepage, Да больше работать не будет. Вы должны использовать: _:-moz-tree-row(hover), .selector {}. Где .selectorваш желаемый селектор.
Adam
4
Firefox будет поддерживать @-moz-document url-prefix()(с пустым префиксом url) fxsitecompat.com/en-CA/docs/2018/…
Орландо,
4
Эта ссылка теперь говорит @-moz-document url-prefix()(с пустым префиксом url) «будет удалена в ближайшем будущем, как только будут решены основные проблемы совместимости». и действительно, похоже, он больше не работает.
Дэйв Морс
2

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

Т Нго
источник