主页 / computer / 问题 / 1718482
Accepted
martixy
Asked: 2022-04-29 08:03:40 +0800 CST

我可以从浏览器中恢复多少垂直空间？

  • 772

我正在尝试在浏览网页时最大化我的可用屏幕区域。

假设我正在研究一些东西，我想打开并查看尽可能多的页面和尽可能多的内容。

我可以尽可能多地水平平铺窗户，但垂直空间有点棘手。

以 Chrome 为例：
铬的...铬

现在，隐藏书签栏很容易。但是地址栏和标签栏呢？有什么可以在那里做的吗？也许其他浏览器可以隐藏标签和地址栏，即使 Chrome 不能？

还有摆弄网页本身。

例如，我尝试隐藏滚动条，同时保留滚动功能：（
body::-webkit-scrollbar { width: 0 !important }或 Firefox 的等价物）

然而，令人沮丧的是，水平滚动条后面仍然有一个黑条，它不是我能找到的任何可样式化元素的一部分。

我们能得到多少？

到目前为止，我最好的想法是创建一个包含多个平铺 iframe 的自定义网页，我可以将其置于全屏模式，但我实际上从未使用过 iframe，而且我不喜欢我怀疑这种方法会造成的痛苦.

browser usability

1 个回答

  1. Best Answer

    我将 Firefox 与Tree Style Tabs插件一起使用。F11这使您可以在树结构中排列选项卡——非常适合组织研究和工作票，这是我最初听说树样式选项卡的地方——而且，在 Firefox 中，您可以在保持选项卡栏打开的同时进入全屏 ( )可见的一侧（您也可以通过 切换它F1）。

    话虽如此，有效地使用 Tree Style Tabs涉及设置about:config选项和创建自定义userChrome.css. 所以我将进入下面的步骤。

    零

    您需要安装 Firefox，因为 Tree Style Tabs 仅适用于 Firefox。然后，您需要安装Tree Style Tabs插件。

    第一的

    您要启用的about:config选项是：

    toolkit.legacyUserProfileCustomizations.stylesheets

    在此处输入图像描述

    它默认为false. 切换到true。

    第二

    然后，您可以在根配置文件目录中创建一个chrome/userChrome.css文件。访问和列出的顶级配置文件应该是正在使用的配置文件。它应该向您显示根目录的路径：about:profiles

    在此处输入图像描述

    打开那个目录。您可能需要创建chrome目录。然后，在chrome目录中，添加一个userChrome.css文件。我的如下：

    @namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

/* Hide horizontal tab toolbar */
#TabsToolbar {
    visibility:collapse!important;
}

/* Hide "Tree Style Tabs" sidebar header */
#sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"] #sidebar-header {
    display:none;
}

    切换该about:config条目并创建userChrome.css文件后，关闭浏览器并重新打开它。请注意，选项卡现在位于左侧，您有多种选项可以将新选项卡作为现有选项卡的子选项卡或兄弟选项卡打开。

    演示

    无论我如何尝试，我都无法获得 2 MiB 以下的有用 GIF 来在 SuperUser 中进行本机演示。所以......你可以在 imgur 上看到一个演示：

    https://imgur.com/a/7EsXelz

    在没有全屏的情况下摆脱更多的垂直空间

    我注意到您的一条评论想要摆脱导航栏并且不想使用全屏功能。我发现了这个，除非您将鼠标悬停在该区域上，否则它将隐藏导航栏。userChrome.css这是您可以进行的另一个调整：

    /* Hide nav bar entirely unless moused over */
#nav-bar {
  /* customize this value. */
  --navbar-margin: -44px;

  margin-top: var(--navbar-margin);
  margin-bottom: 0;
  z-index: -100;
  transition: all 0.3s ease !important;
  opacity: 0;
  background-color: rgba(0,0,0,0.8) !important;
}

#navigator-toolbox:focus-within > #nav-bar,
#navigator-toolbox:hover > #nav-bar
{
  margin-top: 0;
  margin-bottom: var(--navbar-margin);
  z-index: 100;
  opacity: 1;
}

    在此之间，删除书签栏，并使用 F1 隐藏树样式选项卡，您可以在不全屏的情况下减少占用的空间：

    在此处输入图像描述

    请注意，唯一占用的垂直空间是由Menu Bar. 选择“隐藏”它并没有完全摆脱它，只是缩小了一点。

    • 2

相关问题