Bootstrap 3 - 更改下拉菜单的背景颜色 [英] Bootstrap 3 - Change dropdown background colour

问题描述

我对Bootstrap很新，我已经设置了一个下拉药片，并用颜色打。

I'm quite new to Bootstrap, I've set up a dropdown pill and played around with the colours.

我想做的是更改选择后的下拉标题丸的颜色。目前更改为浅灰色：

What I'd like to do is change the colour of the dropdown title pill after it has been selected. It currently changes to a light grey:

这是我的代码：

<div class="row hidden-xs">
  <div class="col-md-12">
    <ul class="nav nav-pills nav-justified nav-filter">
      <li role="presentation"><a href="#">Valentine's Day</a></li>

      <li role="presentation" class="dropdown">
        <a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-expanded="false">
          Recipient <span class="caret"></span>
        </a>
      </li>

      <li role="presentation"><a href="#">Occasion</a></li>
      <li role="presentation"><a href="#">Type</a></li>
      <li role="presentation"><a href="#">New</a></li>
      <li role="presentation"><a href="#">On Sale</a></li>
    </ul>
  </div>
</div>

CSS会覆盖这种颜色？

What would the CSS be to overide this colour? - not the dropdown itself, just the title link.

感谢

推荐答案

p>您将覆盖 .nav-pills 的悬停，活动和焦点状态。

You would override the hover, active and focus state of .nav-pills like this..

.nav-pills>li>a:hover {
    background-color: #FF6699;
}
.nav-pills .open>a, .nav-pills .open>a:active, .nav-pills .open>a:focus{
    background-color: #FF6699;
}

演示

这篇关于Bootstrap 3 - 更改下拉菜单的背景颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！