我必须做一些不寻常的事情,因为到目前为止,我在Stack Overflow上发现的相关问题和答案对我不起作用。我是CSS的新手,所以答案可能很明显。
我更喜欢避免使用的解决方案!important
,并且如果可能的话,仅适用于网站标头(例如,不适用于网站上的其他任何地方;也就是说,仅适用于带有的块内的内容id="my-block"
)。
另外,想要解决方案以使其适用于导航中的所有级别(第一,第二等)。
这是我尝试的:
.navbar .navbar-default > li > a:hover {
background-color: #FFFF00;
color: #FF0000;
}
这是在我的网站顶部运行的代码:
<nav id="my-block" class="navbar navbar-default navbar-static-top navbar-default-siteheader navbar-inner-siteheader">
<div class="container">
<div class="collapse navbar-collapse in" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Menu1<span class="caret"></span></a>
<ul class="dropdown-menu">
...
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Menu2<span class="caret"></span></a>
<ul class="dropdown-menu">
...
</ul>
</li>
</ul>
</div>
</div>
</nav>
改变
.navbar .navbar-default > li > a:hover
至
#my-block.navbar li a:hover
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句