http://jsfiddle.net/mblase75/8Sd9m/(打开足够宽的“结果”窗口以获得桌面菜单栏,而不是折叠的智能手机菜单。)
我正在尝试使用新颜色和样式自定义 Twitter Bootstrap 站点。如果没有 LESS 安装,我将使用良好的老式 CSS 覆盖。
我现在遇到的问题是菜单项。我可以用红色覆盖默认的灰色背景,但是如果我单击“我们的团队”或“投资组合”打开下拉菜单,然后将鼠标向下移动到下拉菜单,菜单项将切换为默认灰色。
奇怪的是,如果我<a>
在 Chrome 或 Firefox 调试器中选择有问题的标签,它会切换回红色!只有在我的调试器中选择具有灰色背景的标签之前。
我认为这一定是 Bootstrap Dropdown JS 的一些特性,但我看不到它改变了 DOM 中的任何内容,无论是样式还是类。
基本 CSS:
.navbar-default .navbar-nav > .open .dropdown-menu > li > a,
.navbar-default .navbar-nav > li > a {
color: #eb212e;
border-color: #eb212e;
}
.navbar-default .navbar-nav > li.open > a,
.navbar-default .navbar-nav > li.open > a:hover,
.navbar-default .navbar-nav > .open .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav > li > a:hover {
color: #fff;
border-color: #eb212e;
background-color: #eb212e;
}