代码之家 › 专栏 › 技术社区 › Curnelious

如何更改导航栏字体和文本颜色?[复制品]

twitter-bootstrap

Curnelious · 技术社区 · 6 年前

这个问题已经有了答案:

我什么都试过了( 引导程序4 )不能:

.nav.navbar-nav.navbar-right  li a {
    color: green;
}

不会起作用的。

导航栏列表如下:

 <div class="collapse navbar-collapse navbarSupportedContent">
              <ul class="navbar-nav ml-auto">
                   <li class="nav-item">
                       <a class="nav-link" href="#home"><i class="fa fa-home fa-fw" aria-hidden="true"></i>&nbsp;Home</a>
                   </li>
                   <li class="nav-item">
                       <a class="nav-link" href="#home"><i class="fa fa-home fa-fw" aria-hidden="true"></i>&nbsp;Create</a>
                   </li>
               </ul>
           </div>

也无法更改字体。

2 回复 | 直到 6 年前

Jenish Shrestha 6 年前

我想你把上面的代码放在标签里了。你可以使用给定的css。

nav.navbar-nav>li.nav-item>a {
color: green;
font-family: Arial,"Helvetica Neue",Helvetica,sans-serif;
}

Maniraj Murugan 6 年前

你应该这样修改代码,我已经做了工作示例,请看 https://www.bootply.com/fOgwVUAbzr

Html:

<nav class="navbar navbar-expand-lg">
  <div class="collapse navbar-collapse" id="navbarSupportedContent">
    <ul class="navbar-nav ml-auto">
    <li class="nav-item">
       <a class="nav-link" href="#home"><i class="fa fa-home fa-fw" aria-hidden="true"></i>&nbsp;Home</a>
    </li>
    <li class="nav-item">
       <a class="nav-link" href="#home"><i class="fa fa-home fa-fw" aria-hidden="true"></i>&nbsp;Create</a>
     </li>
    </ul>
  </div>
</nav>

CSS:

.navbar-nav li a {
    color: green;
}

推荐文章

xajetin · 导航不更改滚动上的颜色

2 年前

Noor ul ain Ibrahim · 如何在一行中制作两个大小相同的按钮?

2 年前

Bryan Santos · 固定表头与引导

2 年前

Nicolas Berthier · Bootstrap 5基于内容的包装

2 年前

tym · 根据用户偏好显示字段

2 年前

Sheryar Khan · 如何仅使用html、css、bootstrap、javascript/jquery创建html页面?

2 年前

Pavel · 当验证DIV可见时,引导网格会移动

6 年前

Sam · 在标题中嵌入Bootstrap 3导航栏

6 年前

Alexander David · 折叠卡打开,然后立即再次关闭

6 年前

Sandeep Bhardwaj · div的一致行为,与设备分辨率无关

6 年前