css - 在导航栏悬停时显示 firefox 57 标签栏

标签 css firefox-quantum

我正在尝试编辑 userChrome.css 文件以默认隐藏 FF 57 上的标签栏并使用以下代码完成

#TabsToolbar {
    visibility: collapse !important;
}

我希望只有当我将鼠标悬停在导航栏上时标签栏才可见,即包含地址字段、导航按钮、菜单按钮等的工具栏。所以,我确实尝试了下面的方法。

#nav-bar:hover+#TabsToolbar{
    visibility: visible !important;
    background-color:red !important;
}

我注意到 hover 属性在 #nav-bar 上根本不起作用,因为我注意到即使背景颜色也没有改变。

更新: 一般来说,css 会像这样工作:

#b
{
visibility: collapse;
}
#a:hover+#b
{
visibility: initial !important;
}
<!DOCTYPE html>
<html>
<body>

<toolbar id="a">div a
	<p>This para</p>
</toolbar>
<toolbar id="b">div b</toolbar>
</body>
</html>

最佳答案

这对我有用。

#TabsToolbar {
    visibility:collapse;
}

#navigator-toolbox:hover #TabsToolbar{
    visibility: visible !important;
    
}

这通过检测整个顶部导航栏上的悬停来工作

关于css - 在导航栏悬停时显示 firefox 57 标签栏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47831627/

相关文章:

javascript href悬停取消选择

javascript - 如果其他元素不显示,则填充剩余空间

Firefox 量子,禁用地址字段中的搜索

javascript - 为什么在生成器中调用函数运行得更快?

html - FireFox Quantum 中的大纲被子 div 扩展

Css 过渡和动画

css - 为什么我的字体文件没有下载没有加载?

javascript - 可以使用 WebExtensions 将文件保存到绝对路径吗?

angular - 无法在 Angular 应用程序上设置断点

javascript - 更改在发生过程中创建框的速度(与 DOM "change"事件相关)