【问题标题】:Bootstrap Navbar Dropdown Menu Background Color & Activate on HoverBootstrap 导航栏下拉菜单背景颜色和悬停时激活
【发布时间】:2015-07-28 00:24:40
【问题描述】:

我想让导航栏下拉菜单在悬停时激活,并在激活时更改下拉菜单“按钮”的背景颜色。

这是我的导航栏 html:

<!-- Navigation -->
<nav class="navbar navbar-trans navbar-fixed-top" role="navigation">
  <!-- Container makes the navbar extend across the whole screen, removing the default curved sides -->
  <div class="container">
  <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapsible">
        <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="#">Project Pandora</a>
    </div>
<!-- Collect the nav links, forms, and other content for toggling -->
  <div class="collapse navbar-collapse" id="navbar-collapse-1">
    <ul class="nav navbar-nav">
    </ul>
    <ul class="nav navbar-nav navbar-right">
      <% if defined?(Devise) %>
        <% if user_signed_in? %>
          <li class="dropdown">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Account <b class="caret"></b></a>
            <ul class="dropdown-menu">
              <li><%= link_to "Edit Account", edit_user_registration_path %></li>
              <li class="divider"></li>
              <li><%= link_to "Sign Out", destroy_user_session_path, method: :delete %></li>
            </ul>
          </li>
        <% else %>
          <li><%= link_to "Login", new_user_session_path %></li>
          <li><%= link_to "Sign Up", new_user_registration_path %></li>
        <% end %>
      <% end %>
    </ul>
  </div><!-- /.navbar-collapse -->
  </div><!-- container-collapse -->
</nav>

非常感谢。如果您希望我澄清任何事情,请告诉我。

【问题讨论】:

标签: css twitter-bootstrap navigation navbar


【解决方案1】:

对于第一个问题 - 在悬停时激活导航栏下拉菜单 - 检查 vanburenx 的链接。

如果你想改变下拉菜单的背景颜色 -

ul.dropdown-menu{
  background-color: tomato;

}

【讨论】:

  • 当我点击下拉菜单时它仍然是白色背景。但是当我悬停时正确的颜色。你知道它可能是什么吗?
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2014-08-30
  • 2014-02-02
  • 1970-01-01
  • 2018-10-24
  • 2018-01-05
  • 2018-09-14
  • 1970-01-01
相关资源
最近更新 更多