【问题标题】:how to change background-color of the navigation-bar into different colours如何将导航栏的背景颜色更改为不同的颜色
【发布时间】:2017-01-12 12:27:54
【问题描述】:

如何更改每个 home-project-etc 的背景颜色?

我已经能够改变第一个家庭导航,但似乎无法弄清楚如何改变其余的我认为这与第一个孩子,第二个孩子等有关,只学习了几个月,任何帮助会很棒。

【问题讨论】:

  • 欢迎来到 StackOverflow。请阅读本文并改进您的问题。 stackoverflow.com/help/mcve
  • @JayClarke - 我敢肯定我们不明白你的问题。好吧,我不知道你在问什么。也许向我们展示您的一些代码?也许尝试更详细地描述您的问题...

标签: html css twitter-bootstrap-3 navigation


【解决方案1】:

首先你创建一个类: .nav-justified > li > a{ background-image: none; }

然后为您的每个家庭....项目等选项卡创建一个独特的类,然后将您的背景颜色传递到那里并将背景图像设置为无。

.nav-justified > li.project-tab > a{
  background-color: #1da1f2;
  background-image: none;
  }
<link href="http://getbootstrap.com/assets/css/ie10-viewport-bug-workaround.css" rel="stylesheet"/>
<link href="http://getbootstrap.com/examples/justified-nav/justified-nav.css" rel="stylesheet"/>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<nav>
          <ul class="nav nav-justified">
            <li class="active"><a href="#">Home</a></li>
            <li class="project-tab"><a href="#">Projects</a></li>
            <li><a href="#">Services</a></li>
            <li><a href="#">Downloads</a></li>
            <li><a href="#">About</a></li>
            <li><a href="#">Contact</a></li>
          </ul>
        </nav>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-01-05
    • 2021-09-12
    • 2014-07-30
    相关资源
    最近更新 更多