Question

我尝试更改活性导航丸的背景颜色。我已经尝试过，但是没有用，我需要CSS代码来更改backgorund颜色

<div id="info">
  <ul class="nav nav-pills nav-justified">
    <li class="nav-item">
      <a class="nav-link active" href="#">Siaga Banjir</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" href="#">Data Harian</a>
    </li>
  </ul>
</div>

Answer 1

.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
    color: #fff;
    background-color: #0a0a0a !important;
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<div id="info">
    <ul class="nav nav-pills nav-justified">
      <li class="nav-item bg-danger">
        <a class="nav-link active" href="#">Siaga Banjir</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Data Harian</a>
      </li>
    </ul>
  </div>

Answer 2

<style>
.active{
background:#yourPreferedColorHexCode;
}

</style>

<div id="info">
          <ul class="nav nav-pills nav-justified">
            <li class="nav-item">
              <a class="nav-link active" href="#">Siaga Banjir</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#">Data Harian</a>
            </li>
          </ul>
        </div>

希望这可以帮助您回答查询。

导航栏背景颜色CSS

2 个答案: