关于navbar中修改navbar-brand颜色的问题；

Question

.navbar-brand{
	color: rgba(50,176,59,1) !important;
}

↑css内.

<nav class="navbar navbar-inverse navbar-fixed-top topnav">
    <div class="container topnav">
        <div class="navbar-header">
		    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#example-navbar-collapse">
	        	<span class="icon-bar"></span>
	        	<span class="icon-bar"></span>
	        	<span class="icon-bar"></span>
	    	</button>
	    	<a  class="navbar-brand" href="https://freecodecamp.cn/" target="_blank">ABC</a>
		</div>
		<div class="collapse navbar-collapse" id="example-navbar-collapse">
			<ul class="nav navbar-nav navbar-right">
			  <li><a href="#introduce">A</a></li>
			  <li><a href="#teach">B</a></li>
			  <li><a href="#contact">C</a></li>
			</ul>
		</div>	
  	</div>
</nav>

↑html内

=================================

为什么我只有在输入！important，ABC才能改变颜色！而且改变了颜色之后，他的鼠标悬浮的效果也消失了。

<a  class="navbar-brand" href="https://freecodecamp.cn/" target="_blank">ABC</a>

Answer 1

原因是在css中,属性后面添加!important的用处是提高它的优先级到最高,也就是说只要给属性添加了!important后,即使在别的地方定义了它同样属性的值,是不起效果的.所以,你加入!important后,文字就会显示你设定的颜色值,但别的地方设定的navbar-brand属性就不能显示出来,所以你的颜色出来了,但鼠标事件都没了