CSS 활성 속성이 제대로 작동하지 않습니다.

Question

http://jsfiddle.net/mrto2/nD2eB/을 살펴보십시오.
은 내가 활성 글꼴 및 테두리 색상 만의

#filters li a:active { 
    border-top: 2px solid #EB2F26; 
    color: #EB2F26; 
    } 

준 우리는 일부 메뉴, 색 및 테두리 변경을 클릭하지만 마우스 놓기 동안 다시 켤 때. 어떻게 해결할 수 있을까요?

Answer 1

link:active 선택기가 <a> 클릭 수에 적용되므로이 문제를 해결할 일반 CSS 방법은 없습니다. li.active css 클래스를 정의하고이를 js를 통해 동적으로 링크에 추가하여이 문제에 접근 할 수 있습니다.

li a.active { 
    border: 2px red solid; 
} 

<ul class="nav"> 
    <li><a>Link 1</a></li> 
    <li><a>Link 2</a></li> 
    <li><a>Link 3</a></li> 
    <li><a>Link 4</a></li> 
<ul> 

// Using Jquery 
$('ul.nav li').on('click', function(){ 
    $(this).parent().find('a').removeClass('active'); 
    $(this).addClass('active'); 
});