有没有办法让 CSS 选择器应用于特定的主机？（对于我的自定义浏览器样式表。）答案

【问题标题】：Is there a way to have a CSS selector apply to a specific host? (For my custom browser stylesheet.)有没有办法让 CSS 选择器应用于特定的主机？（对于我的自定义浏览器样式表。）
【发布时间】：2011-03-16 20:55:14
【问题描述】：

我想将样式（编辑：在我的浏览器的用户定义样式表中，我机器上的一个本地文件，让我可以自定义其他人的网站为我呈现的方式）到特定网站，但是许多网页上的选择器通常是通用的（显然我无法控制，因为它们不是我的网站。）

如果我必须使用非常通用的选择器（例如#box）来自定义给定的网站，则该样式可能会无意中影响具有相同通用选择器的其他网站。有没有办法用选择器指定域，这样我就可以为每个网站分开自定义样式？

我还发现 @-moz-document 看起来不错，但它是 Mozilla 特定的，我使用 WebKit 浏览器。有没有等价物？

@-moz-document url(https://www.example.com/decrypt.php) {

【问题讨论】：

（这最初是一个答案，但我用一些额外的信息做了评论。）据我所知，document 指令是 Mozilla 扩展，因此在 WebKit 中找不到（或任何其他引擎）。 There's now a proposal for a @document rule in CSS3，基于 Gecko 的实现，但 Gecko 仍然是目前唯一实现它的引擎。
Generic @document 被推迟到 CSS4，但我们可能会在此期间看到 @-<x>-document 变体，我不知道具体引擎的进展情况。

标签： css webkit

【解决方案1】：

CSS 是否托管在允许您编写脚本的服务器上？您是否尝试过编写服务器端脚本来根据为页面提供服务的主机生成正确的 CSS 规则？

2010 年 3 月 30 日添加的编辑：

您最好使用 Greasemonkey 扩展来执行此操作。它比用户定义的样式表强大得多，因为您可以使用 JavaScript，并且添加域或特定于页面的规则就像在标头中的 cmets 中添加特殊标签一样简单。 Greasemonkey 专门用于处理您的问题类型，虽然您需要一个插件来在 Firefox 中运行 Greasemonkey 脚本，但 Chrome 内置了 Greasemonkey 支持。

【讨论】：

这不是服务器端的，它是我的浏览器用来覆盖我浏览的页面上的行为的本地文件。
您最好使用 Greasemonkey 扩展来执行此操作。它比用户定义的样式表强大得多，因为您可以使用 JavaScript，并且添加域或特定于页面的规则就像在标头中的 cmets 中添加特殊标签一样简单。 Greasemonkey 专门用于处理您的问题类型，虽然您需要一个插件来在 Firefox 中运行 Greasemonkey 脚本，但 Chrome 内置了 Greasemonkey 支持。
我更喜欢 Safari，所以我会使用 Safari 扩展，但我认为你是对的——CSS 无法绕过它。如果您想将您的评论编辑到您的答案中，我会将其标记为已接受。
完成。我相信这可能是 Safari 的扩展：8-p.info/greasekit
是的，用户脚本无疑是最好的解决方案。

【解决方案2】：

如果您可以使用 javascript 修改 HTML，那就有办法了。它可以是这样的（使用 JQuery）：

var hostId = // detect the id of the host
var highLevelElement = $("body");  // or a different element that holds everything
highLevelElement.attr("id", hostId);

然后，在你的 CSS 中，你可以这样做：

#Mozilla div.Whatever { background-color: orange; }
#IE6 div.Whatever { background-color: red; }
#IE9 div.Whatever { background-color: green; }
// etc.

【讨论】：

这必须是一个浏览器扩展，因为它使用 Javascript，我希望避免这种情况。
为什么投反对票？注意帖子的编辑历史和发布此答案的时间。导致您不喜欢此答案的信息当时不可用。

【解决方案3】：

考虑安装一个广告拦截器，例如 uBlockOrigin，然后编写一些自定义过滤器。您可以在设置 -> 我的过滤器中添加这些自定义过滤器。

examplewebsite.com###ExampleId, .ExampleClass:style(background-color: yellow !important;)

【讨论】：

【解决方案4】：

嗯，我认为 php 将是最合理的解决方案，实际上非常简单。在某些情况下，使用 php 决定做什么/何时执行并回显某些 css 文件。

如果您需要更多帮助，请告诉我们更多有关您的问题的信息，我会为您编写完整的解决方案。

【讨论】：

很确定 PHP 在这里帮不了我。我正在尝试在浏览器的自定义样式表中设置它。这不是服务器端代码，但感谢提供。