不能更改导航栏中的字体颜色

-1

我似乎无法更改导航栏中的字体颜色，导航栏css中的其他元素可以使用，但出于某种原因不能使用字体颜色。我试图改变这个类，但是接下来我的其他元素不能工作。我似乎无法找到问题，虽然这是我第一次使用bootstrap。不能更改导航栏中的字体颜色

CSS

.navbar { 
background-color: white; 
border: none; 
color: #0000; 

} 

.navbar-brand { 
font-size: 50px; 

}

HTML

<head> 
<title></title> 
<meta charset="utf=8"> 
<meta http-equiv="X-UA-Compatible" content="IE=edge"> 
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> 
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
<link rel="stylesheet" type="text/css" href="css/main.css"> 

</head> 
<nav class="navbar navbar-default"> 
    <div class="container-fluid"> 
     <div class="navbar=header"> 
      <a class="navbar-brand" href="#">TRAVELLING</a> 
     </div> 
      <ul class="nav navbar-nav navbar-right"> 
       <li><a href="#">home</a></li> 
       <li><a href="#">about</a></li> 
       <li><a href="#">contact</a></li> 
      </ul> 
     </div> 
    </div> 
</nav> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"> 
</script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"> 
</script> 

</body> 
</html>

来源

2017-08-15 user3444694

'颜色：＃0000;'==>'颜色：＃000;' –

我同意@AlonEitan你也可以使用'color：＃000 important！'来强制效果。 – Rahel

我明白你的意思，但仍然没有为我工作，使用重要！，仍然没有工作。我试着把红色仍然没有改变字体颜色。 – user3444694

.navbar { 
 
background-color: white; 
 
border: none; 
 
color: #000; 
 
} 
 

 
.navbar .navbar-nav li > a{ 
 
    color: orange !important; 
 
} 
 

 
.navbar .navbar-brand { 
 
font-size: 50px; 
 
color: blue !important; 
 
}

<head> 
 
<title></title> 
 
<meta charset="utf=8"> 
 
<meta http-equiv="X-UA-Compatible" content="IE=edge"> 
 
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> 
 
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
<link rel="stylesheet" type="text/css" href="css/main.css"> 
 

 
</head> 
 
<nav class="navbar navbar-default"> 
 
    <div class="container-fluid"> 
 
     <div class="navbar-header"> 
 
      <a class="navbar-brand" href="#">TRAVELLING</a> 
 
     </div> 
 
     <ul class="nav navbar-nav navbar-right"> 
 
      <li><a href="#">home</a></li> 
 
      <li><a href="#">about</a></li> 
 
      <li><a href="#">contact</a></li> 
 
     </ul> 
 
    </div> 
 
</nav> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"> 
 
</script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"> 
 
</script> 
 

 
</body> 
 
</html>

来源

2017-08-15 04:27:41 Muhammad

谢谢。这对我有效。所以你必须使用独立的类来更改导航栏中的字体？ – user3444694

-1

您可以通过用户的navbar逆代替导航栏默认。如果想让自己的颜色只读出css样式表中导航栏的css属性。

来源

2017-08-15 03:50:26

尽管如此，这并没有回答上述代码不起作用的问题。 –

您已为颜色属性分配了错误的值。它应该是3或6位像color: #000或color: #000000

CSS

.navbar { 
background-color: white; 
border: none; 
/*color: #0000;*/ color: #000; 

} 
.navbar ul li > a{ 
color: #f00; 
}

来源

2017-08-15 03:52:26 bellabelle

我看到了，但尝试了所有，但仍然没有帮助，甚至使用只是用过的词没有工作。 – user3444694

@ user3444694你的意思是改变你的导航栏颜色ul li a？或导航栏中的所有链接？ – bellabelle

你可以使用这个.navbar ul li a {color：＃f00; }或.navbar ul li> a {color：＃f00; } – bellabelle

你也可以要改变使用内联CSS在你的导航栏。尝试这样的事情

<nav class="navbar navbar-default" style="background-color:white;border:none;color:#000;">

来源

2017-08-15 04:03:29

每次你想改变一些风格时，这不是上帝的做法。最终，HTML将成为一大堆混搭标记和风格的混合体。 –

我同意。但有时候，当懒惰袭击时你必须做这样的事情。大声笑 –

代码

.navbar { 
background-color: white; 
border: none; 
color: black; 
} 

.navbar-brand { 
font-size: 50px; 
} 
.navbar a{ 
color:red; 
} 
.navbar li a{ 
color:red; 
}

来源

2017-08-15 04:07:52 Dom

尝试类似：

.navbar { 
    background-color: white !important; 
    border: none; 
} 

.navbar-brand { 
    font-size: 50px; 
} 

.navbar *{ 
    color: #000 !important; // should set font color for element contain text 
}

来源

2017-08-15 04:21:28 Wiz

不能更改导航栏中的字体颜色

回答

相关问题