【问题标题】：I know the CSS selector I want to hide - how do I set a "UserStyle" to "display:none" it?我知道我想隐藏的 CSS 选择器 - 如何将“UserStyle”设置为“display:none”呢？
【发布时间】：2023-03-13 03:41:01
【问题描述】：

所以我在 Mac 和 iOS 上使用了一个叫做 1Blocker 的东西。我发现它非常有用。在 Mac 应用程序上，它有助于告诉您在 iOS 应用程序中创建的规则。

该网页现在在我所有设备上的 Safari 上看起来都很完美。

但我也使用 Fluid 应用程序，一种特定于站点的浏览器。 1Blocker 不影响这一点。

它具有执行 UserScripts 和 UserStyles 的功能。

我的目标是隐藏以下 CSS 选择器 #rhf-container .rhf-border

我在 UserStyles 中写什么来实现这一点？

我的尝试在这里：

[div id="rhf-container"] {
display: none;
}

代码截图

this is the screenshot of the page as requested

【问题讨论】：

标签： css css-selectors userstyles fluid-mac-app-engine

【解决方案1】：

根据我对 Fluid 应用程序的理解，Userstyles 仍然使用普通的 CSS 语言。这意味着隐藏你想要的元素，它应该很简单：

#rhf-container .rhf-border {
    display: none;
}

如果你在那里没有成功，我也会尝试：

#rhf-container .rhf-border {
    display: none !important;
}

使用!important 会将您的新显示设置推送到任何与display 设置相关的css 之上，并且位于同一元素上。

如果您仍然没有任何运气，请确保在您的 HTML 和 CSS 中正确命名元素。你应该检查你有一个id等于rhf-container的元素，里面有一个class等于rhf-border的子元素

编辑：

由于您的问题已更改（在对此答案的回复中），我会将其添加为编辑。要隐藏整个rhf-container，您只需要这样做：

#rhf-container {
    display: none;
}

如果你有机会，我强烈建议你也阅读一些CSS documenation，一旦你陷入困境，它实际上真的很有趣。

【讨论】：

不走运。如果我希望不加载rhf-container 的整个（一个肯定存在的div id）怎么办。
此外，是否需要开头的#？我查看了他们拥有的其他用户样式和前面的@，例如@font-face？（请原谅我的无知，我正在学习）
id="rhf-container" 和 class="rhf-border" 肯定存在
@NicholasKunze 好的，我已经在我的答案中添加了额外的代码，它应该只是隐藏整个 rhf-container。不，完全不用担心！毕竟我们是来帮忙的:)。简短地解释一下，当您通过id 查找元素时使用主题标签，在通过class 和@ 符号查找元素时使用句点/句号用于需要对浏览器进行特殊说明时使用，例如@font-face 导入字体，@media 启动媒体查询
@NicholasKunze 如果您可以评论您遇到此问题的应用程序的网站/页面的链接，我们可能会更容易提供帮助。如果您不能这样做，也许可以发送您用于创建元素的 HTML 代码的屏幕截图？

【解决方案2】：

你可以试试

div[id="rhf-container"] {
  display: none;
}

/* or */

div#rhf-container {
  display: none;
}

div[id="rhf-container"][class="rhf-border"] {
  display: none;
}

/* or */
div#rhf-container.rhf-border {
  display: none;
}

如果不起作用，那不是正确的元素

【讨论】：

成功了！我用第一个开始div#rhf-container {