李翱翔引导

时间:2014-08-21 17:53:44

标签: html css twitter-bootstrap hover html-lists

我尝试将下拉菜单的悬停颜色设为蓝色,但没有任何效果。我尝试了不同的代码而没有成功。希望有人能提供帮助。我的代码如下。当鼠标悬停时,我希望下拉选项卡显示为蓝色。

<!-- Fixed navbar -->
<div class="navbar navbar-default navbar-fixed-top" role="navigation">
  <div class="navbar-inner">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="/">Pudding</a>
    </div>
    <div class="navbar-collapse collapse">
      <ul class="nav navbar-nav">
        <li><a href="./">Home</a></li>
        <li><a href="./forums.php">Forums</a></li>

      </ul>
      <ul class="nav navbar-nav navbar-right">
         <li class="dropdown">
            <a href="" class="dropdown-toggle" data-toggle="dropdown"> <?php if ($user->is_logged_in()) {echo "Welcome";} if (!$user->is_logged_in()) {echo "Please log in";} ?> <span class="caret"></span></a>
            <ul class="dropdown-menu" role="menu">
              <li><a href="#">Another action</a></li>
              <li><a href="#">Something else here</a></li>
              <li class="dropdown-header"></li>
              <li><a href="#">Separated link</a></li>
              <li class="divider"></li>
              <li><a href="/?1" name="link1">
              <?php 
                  if($user->is_logged_in()){echo "Log out";}
                  if(!$user->is_logged_in()) {echo "Log in";}
              ?>
              </a></li>
        </ul>
       </ul>
    </div><!--/.nav-collapse -->
  </div>
</div>
</div>`

1 个答案:

答案 0 :(得分:2)

这对我有用......

首先给你的第一个父div:

<div class="navbar navbar-default navbar-fixed-top" role="navigation">

说出#my_blue_nav的id然后添加这个CSS。

#my_blue_nav li > a:hover{
    background-color: blue;
}

#my_blue_nav li.active a{
    background-color: blue !important;
}

还要确保在bootstrap.css

之后加载custom.css