如何使用 Firefox userContent.css 覆盖本地 html 页面的样式？答案

【问题标题】：How can I override styles of a local html page using Firefox userContent.css?如何使用 Firefox userContent.css 覆盖本地 html 页面的样式？
【发布时间】：2022-09-30 11:56:16
【问题描述】：

我正在使用，无济于事，@-moz-文档网址在文件内用户内容.css在指定的 URL 中应用 CSS 规则。以下是 HTML 和 CSS 代码：

HTML(page.html)

...
<style type=\"text/css\">
.mood {
    background: pink;
}
</style>

<body>
    <div class=\"mood\">
    </div>
</body>

这CSS我在 userContent.css 中添加的规则：

@-moz-document url (C:/Users/User/Documents/page.html) {
    .mood {
        background: red !important;
    }
}

我说还有其他最重要的规则用户内容.css如果指定的 URL 是一个网站，那么它确实有效，例如@-moz-文档网址 (website.com)不过，对于这些其他规则，我不必编写 HTML 代码。

我也尝试添加文件：//,文件：///,文件：/////地址前：（文件：// C：/ ...）正如我在http://kb.mozillazine.org/Links_to_local_pages_do_not_work 的一个明显相关的主题中看到的那样

@-moz 不是无用的，因为它们仅适用于 @ 4% of users in the world 的 Firefox (Gecko) 浏览器吗？\"本地 html 文件\"是一个广义的术语。您是指来自<link>、<style> 和/或.style 属性的样式吗？假设userContent.css 来自<link>，可以安全地假设任何继续它的东西都应该覆盖它。
@zer00ne 如果您像我一样属于那 4％，那根本没用。我使用 Firefox 是因为我使用的其他导航器 IE 和 Chrome 不允许我通过 userContent.css 和 userChrome.css 进行 Firefox 允许的良好样式自定义。本地 html 文件是指保存在我的 HDD 中的 html 页面 (*.html)。我编辑了我的问题，我认为它可能会回答您提出的其他问题。谢谢！

标签： html css

【解决方案1】：

您是否启用了本文中提到的旧版“toolkit.legacyUserProfileCustomizations.stylesheets”标志？： screenshot

https://superuser.com/questions/318912/how-can-i-override-the-css-of-a-site-in-firefox-with-usercontent-css

如果您没有启用该标志......就是这样

看起来像几年前 Firefox 的人默认禁用了这个（为了启动性能，在哲学上发布以避免在启动期间读取文件）： https://bugzilla.mozilla.org/show_bug.cgi?id=1541233

下一个想法...您是否尝试使用“域”一词而不是“网址”？我现在也在使用 userContent.css 来为我访问的一个网站使用一个很小的自定义 CSS，但从未尝试过使用本地 HTML 文件

@-moz-document domain(homeserver.local) {

.block-wrapper, .blue-block, .background-block .block-body {
    transform: scale(-1, 1);
    transition: 2s;
}

.polling-block {
    transform: scale(1);
}

}

【讨论】：