Преемник @ -moz-document url-prefix ()

Question

Я пытался применить другой стиль в Firefox, используя @-moz-document url-prefix(), но он больше не поддерживается.Как я могу сделать это сейчас?

Простой пример:

HTML

.test {
  background-color: red;
}

@-moz-document url-prefix() {
  .test {
    background-color: blue;
  }
}

<div class="test">asd</div>

Answer 1

В канале релиза FF V61 и V59 Beta / Dev он был удален, исключение составляет функция url-prefix(), поэтому ваш код должен работать, вот некоторая информация и код:

The *Правило 1005 * больше не доступно из веб-контента, поскольку оно может использоваться злоумышленниками для внедрения CSS для кражи личных данных в URL-адресах сторонних сайтов.Пользователи Firefox по-прежнему могут использовать это правило в пользовательской таблице стилей для персонализации своего просмотра.

Поддержка правил уже удалена из ночной и ранней бета-версии / DevEdition начиная с Firefox 59 и удалена из всехканалы с Firefox 61.

Исключением является функция пустой URL-префикс , которая использовалась в качестве хакера CSS для Firefox.Он продолжает анализироваться на канале выпуска, чтобы избежать поломок, но будет удален в ближайшем будущем, когда будут решены основные проблемы совместимости

Источник

Вв текущей последней версии (62.0.3) она все еще работает, как вы можете видеть в этой скрипке

и используя ваш фрагмент:

.test{
  background-color: red;
}

@-moz-document url-prefix()  {
  .test {
    background-color: blue;
  }
}

<div class="test">test</div>

---

Однако, в ближайшее время перестанет работать, вы можете проверить все виды взломов браузера здесь , так как вы ищетеfirefox они здесь ,

Я бы использовал это hack : @supports (-moz-appearance:meterbar) {}

Используя ваш фрагмент:

.test{
  background-color: red;
}

@supports (-moz-appearance:meterbar)  {
  .test {
    background-color: blue;
  }
}

<div class="test">test</div>