☰

如何使用 uBlock 让元素填满浏览器窗口的宽度？

tag-icon • tag-icon css ublock-origin
如何使用 uBlock 让元素填满浏览器窗口的宽度？

例如，此页面位于超级用户，页面的主要内容被挤压，因此很难阅读或集中注意力。我想从目前的情况来看渲染到这。

之后的截图链接是我能做的最好的事情，让我的浏览器呈现我想要用 uBlock 实现的内容，我不想改变字体大小，只想改变元素的宽度。

根据选择器，我感兴趣的填充浏览器宽度的元素称为superuser.com###content。

我首先尝试了这个但似乎没有任何影响：

superuser.com###content:style(width: 100vw !important;)

!Hide Right Sidebar
superuser.com##.js-sticky-leftnav.left-sidebar--sticky-container
!Hide Left Sidebar
superuser.com##.ps-relative.js-pinned-left-sidebar.left-sidebar

然后我尝试：

superuser.com###mainbar > div:style(width:100vw !important;)

!Hide Right Sidebar
superuser.com##.js-sticky-leftnav.left-sidebar--sticky-container
!Hide Left Sidebar
superuser.com##.ps-relative.js-pinned-left-sidebar.left-sidebar
! This gets in the way too
superuser.com##.show-votes

但我最终只是制造了一场新的混乱，如下图所示这里。任何进一步的改变只会让情况变得更糟。我通过查看其他问题并搜索 CSS 属性（例如）拼凑了大部分内容100vw。

但我似乎没有取得任何进展。有人能告诉我如何正确地做到这一点吗？如果能举个例子，我将不胜感激。

答案1

这是诀窍：

superuser.com###sidebar
superuser.com###left-sidebar
superuser.com##.container:style(width: 100% !important; max-width: 100% !important;)
superuser.com###content:style(width: 100% !important; max-width: 100% !important;)

您需要检查设置的每个相关元素width、浏览器的Inspect element功能类型以及需要查看附近的 HTML。您错过了.container。第二个问题是缺乏max-width操作，这推翻了width。

此外，尽可能使用 ID，而不是类别。使用此类工具时，您需要尽可能具体。

相关内容