背景正常和背景活躍在CSS

Question

我在CSS如下代碼：

#nav li a:active{ 
background-color:brown; 
} 

#nav li a.index{background:purple;} 
#nav li a.advertiser{background:red;} 
#nav li a.publisher{background:green;} 
#nav li a.new{background:blue;} 
#nav li a.status{background:orange;} 

#nav li a:hover { 
border-bottom:5px solid brown; 
} 

和HTML

<ul id="nav"> 
<li><a class="index".... 
<li><a class="advertiser"... 
<li><a class="publisher"... 
<li><a class="new".... 
<li><a class="status"..... 
</ul> 

的事情是，當我點擊它，將其轉換爲棕色，但它不會保持棕色。 我在哪裏誤認爲無法實現。

Answer 1

:active會給亮點當按鈕或文本被按下，你需要編寫jQuery來實現這一點。試試下面這個例子：

<ul>  
<li><a class="black classname" id="click">Home</a></li> 
<li><a class="black" id="click">about</a></li> 
<li><a class="black" id="click">services</a></li> 
</ul> 

CSS

.black{color:black} 
.classname{color:red} 

jQuery的

$(document).ready(function(){ 

    $("a#click").click(function(){ 
     $("a").removeClass('classname') 
     $(this).addClass('classname') 
    }); 

}); 

演示http://jsfiddle.net/XFYjz/

Answer 2

：活動狀態只有在用戶點擊它時纔會被激活;點擊完成後，錨點或按鈕的活動狀態不會持續。

如果你想保持錨褐色點擊後，您可以使用jQuery來推動一個特定的類，當用戶點擊一個錨：

$('#nav a').on('click', function(e){ 
    e.preventDefault(); //? 

    $('#nav a.active').removeClass('active'); 
    $(this).addClass('active'); 
})