2016-11-22 211 views
5

我需要对导航栏进行一些修改。我一直在努力但无法做到。导航栏字体颜色

*我需要更改bootstrap导航栏的字体颜色。
*我的导航栏背景是透明的,我还需要摆脱默认出现的边框。
*我如何安排导航栏项目列表居中对齐。

请帮忙。以下是html代码。

<nav class="navbar navbar-default navbar-fixed-top"> 
    <div class="container-fluid the-navbar"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> 
     <span class="sr-only">Toggle navigation</span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </button> 


    </div> 
    <div id="navbar" class="navbar-collapse collapse"> 
     <ul class="nav navbar-nav"> 
     <li><a href="cover.html">Learning Pulse</a> 
     <li><a href="Index.html">Home</a> 
     <li><a href="mycourse.html">Course</a> 
     <li><a href="#contact">Contact</a> 

     </li> 
     </ul> 
     <ul class="nav navbar-nav navbar-right"> 
     <li><a href="signup.html"><span class="glyphicon glyphicon-user"></span> Sign Up</a></li> 
    <li><a href="login.html"><span class="glyphicon glyphicon-log-in"></span> Login</a></li> 

    </div> 
</nav> 

CSS中的代码

.navbar { 
position:absolute; 
top:30px; 
z-index:10; 
background:transparent; 
width:80%; 
margin-left:auto; 
margin-right:auto; 
font-style: times; 
font-size:19px; 
} 

.navbar li a { 
color: white; 
} 
+0

在Twitter的[更改导航栏的颜色可能的复制Bootstrap 3](http://stackoverflow.com/questions/18529274/change-navbar-color-in-twitter-bootstrap-3) – vanburen

+0

@ahmed如果这解决了您的问题,请标记为正确的解决方案,谢谢并欢迎来到社区。 –

+1

谢谢非常,它的工作! – Ahmed

回答

4

短短几年CSS行,我们得到了它=)

.navbar { 
    position:absolute; 
    top:30px; 
    z-index:10; 
    background:transparent; 
    width:80%; 
    margin-left:auto; 
    margin-right:auto; 
    font-style: times; 
    font-size:19px; 

} 
.navbar ul{ 
    text-align:center; 
} 
#navbar ul li a { 
    color:red; 
} 

.navbar{ 
    background:lightblue; 
    border:none; 
} 

https://jsfiddle.net/Ldf7xswh/1/

+0

字体颜色不变:( – Ahmed

+0

使用CSS的属性颜色,我更新了我的答案 –