4

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

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

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

在过去的几天里，我研究了这个问题，并尝试了对文件的大量更改，但无济于事。

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

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

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

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

以下是 github 存储库的链接：

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

谢谢！

4

1 回答 1

1

如果您在将鼠标悬停在菜单上时根本不希望颜色发生变化。看到这种风格悬停在你的 tobar

.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" %>
于 2013-06-30T02:24:26.647 回答