Question

我在Zurb Foundation遇到问题，默认情况下，将鼠标悬停在顶部导航栏链接上会突出显示黑色菜单。

使用默认菜单颜色＃111时这很好，但使用其他颜色时会出现问题。

我想做的是完全阻止任何突出显示。当我将鼠标悬停在菜单上时，我不希望颜色发生变化。

过去几天我一直在研究这个问题，并尝试对文件进行多次更改，但无济于事。

我是编码新手，非常欢迎任何帮助。

举一个我正在描述的例子，这里是一个应用程序的Heroku部署的链接，我很快就将我的同事介绍给Rails，以便他可以考虑学习它：

http://vast-headland-1673.herokuapp.com/

Heroku部署说明了当您将鼠标悬停在顶部栏导航栏上的菜单项上时我所描述的内容。

这是github存储库的链接：

https://github.com/marcacyr/Fernando-s-Sample-App

谢谢！

Answer 1

如果您不希望在将鼠标悬停在菜单上时颜色发生变化。看到此样式悬停在您的工具栏上

.top-bar-section li a:not(.button):hover {
background: #000;
}

.top-bar-section li a:not(.button):hover {
background: #000;
}

.top-bar-section ul li>a:hover {
background: #2b2b2b;
}

.top-bar-section ul li>a:hover {
background: #2b2b2b;
}

您可以将background:#000和background:#2b2b2b更改为background:#3b5999，添加一个css文件（例如a.css），然后输入：

/* for dropdown */
.top-bar-section ul li.has-dropdown ul li>a:hover {
background: #4264ab;
}

/* for topbar */
.top-bar-section li a:not(.button):hover {
background: #3b5999;
}

.top-bar-section li a:not(.button):hover {
background: #3b5999;
}

.top-bar-section ul li>a:hover {
background: #3b5999;
}

.top-bar-section ul li>a:hover {
background: #3b5999;
}

在layouts/application.html电话上，a.css看起来像是

<%= stylesheet_link_tag    "application", "a" %>

Zurb Foundation Rails Topbar导航黑色突出显示当鼠标悬停在导航链接上时

1 个答案: