Question

我尝试使用@-moz-document url-prefix()在Firefox中应用其他样式，但不再支持。我现在该怎么办？

简单的例子：

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()函数是个例外，因此您的代码应该可以使用，这里是一些信息和代码：

自@-moz-document规则不再适用于Web内容，因为   攻击者可以将其用于CSS注入以窃取私有数据   在第三方网站的网址中。 Firefox用户仍然可以使用   用户样式表中的此规则可个性化其浏览   经验。

“常规”支持已从“每晚”和“早期”中删除   自Firefox 59起的Beta / DevEdition，并已从所有渠道中删除   使用Firefox 61。

一个例外情况是空url前缀功能已被用作   针对Firefox的CSS hack。它会继续在Release中解析   避免破损的通道，但不久将被移除   主要的兼容性问题已解决

Source

在最新的最新版本（62.0.3）中，它仍然有效，如您在此fiddle中所见

并使用您的代码段：

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

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

但是，在不久的将来停止工作时，您可以在寻找Firefox here时检查所有类型的浏览器黑客here，

我会使用以下hack：@supports (-moz-appearance:meterbar) {}

使用您的代码段：

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

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

@ -moz-document url-prefix（）的后继者

1 个答案: