CSS @-moz-document url-prefix() 有什么作用？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3123063/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
What does @-moz-document url-prefix() do?
提问by Charles Roper
In Simon Collison's newold Responsive Web Design, in the CSS, there are several declarations like this:
在 Simon Collison 的new old Responsive Web Design 中，在 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; }
}
What does this actually do? I've googled for @-moz-document url-prefix() and have found references for its use within userchrome but not standard site stylesheets.
这实际上有什么作用？我在 google 上搜索了 @-moz-document url-prefix() 并找到了在 userchrome 中使用它的参考，但没有找到标准站点样式表。
It usually has a URL passed in as an argument which then restricts the content of the declaration to that URL. However, on Colly's site, there is no argument being passed in. This would indicate that the declaration is operating on the current URL, or anyURL, no? So is what we're seeing here a way of targeting Mozilla-only browsers with certain rules?
它通常有一个 URL 作为参数传入，然后将声明的内容限制为该 URL。但是，在 Colly 的站点上，没有传入参数。这表明声明是在当前 URL 或任何URL 上操作的，不是吗？那么我们在这里看到的是一种针对特定规则的仅限 Mozilla 的浏览器的方法吗？
回答by Oded
Any CSS at-rule that starts with @-moz-is a Gecko-engine-specific rule, not a standard rule. That is, it is a Mozilla-specific extension.
任何以 开头的 CSS 规则@-moz-都是 Gecko 引擎特定的规则，而不是标准规则。也就是说，它是一个特定于 Mozilla 的扩展。
The url-prefixrule applies the contained style rules to any page whose URL starts with it. When used with no URL argument like @-moz-document url-prefix()it applies to ALLpages. That's effectively a CSS hackused to only target Gecko (Mozilla Firefox). All other browsers will ignore the styles.
该url-prefix规则将包含的样式规则应用于 URL 以它开头的任何页面。当不使用 URL 参数时，@-moz-document url-prefix()它适用于所有页面。这实际上是一种仅针对 Gecko (Mozilla Firefox)的CSS hack。所有其他浏览器将忽略样式。
See herefor a list of other Mozilla-specific extensions.
有关其他 Mozilla 特定扩展的列表，请参见此处。
回答by Bella
From https://developer.mozilla.org/en/CSS/@-moz-document
来自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; }
}
回答by Adam
Starting from Firefox 59 you should just use:
从 Firefox 59 开始，您应该只使用：
@document url("https://www.example.com/")
@document url("https://www.example.com/")
The support of -moz-prefixed version of this property have been stopped for web content, because of a bug:
由于存在错误，已停止对该属性的 -moz-prefixed 版本的支持用于 Web 内容：
回答by T Ngo
@supports (-moz-appearance:none){...} worked for me in cases where @-moz-document url-prefix() {...} didn't.
@supports (-moz-appearance:none){...} 在@-moz-document url-prefix() {...} 没有的情况下为我工作。
