CSS, 메뉴 : 활성

Question

내가 간단한 메뉴가 작동하지 :

<ul id="menu2"> 
    <li> <a href="index.php?id=home">Home</a></li> 
    <li> <a href="index.php?id=about">About us</a></li> 
    <li> <a href="index.php?id=contacts">Contacts</a></li> 
</ul> 

과 CSS 파일에서 내가 가진 :

#menu2 { 
    background: black; 
    float: left; 
    list-style: none; 
    margin: 0; 
    padding: 0; 
    width: 220px; 
} 
#menu2 li { 
    margin: 0; 
    padding: 0; 
} 
#menu2 a { 
    background: black; 
    border-bottom: 1px solid #393939; 
    color: #ccc; 
    display: block; 
    margin: 0; 
    padding: 9px 16px; 
    text-decoration: none; 
} 

#menu2 a:hover { 
    background: black url("../images/select.png") left center no-repeat; 
    color: #fff; 
    padding: 9px 16px; 
} 

#menu2 a:active { 
    background: black url("../images/select.png") left center no-repeat; 
    color: #fff; 
    padding: 9px 16px; 
} 

모든 것이 #menu2 a:active에 대한 모든 동안 #menu2 a:hover 작동하지 제외하고는 잘 작동 (같은 규칙으로) 잘 작동합니다. 문제가 무엇입니까? 내가 뭐 놓친 거 없니?

Answer 1

가 정확하게 작동되지 않고 어떤/또는 데모의 자세한 내용을 제공 할 수 여기를 참조 : (테스트) 배경 이미지와 다른 색상 코드가 잘 작동하지 않고

. 코드를 보면 괜찮아 보입니다.

활성 상태는 링크를 눌렀을 때를 나타내므로 메뉴 항목에서 마우스 버튼을 누른 상태로 유지하면 마우스 오버 버튼을 누른 채 활성 상태가되면 동일한 속성을 갖기 때문에 예상대로 작동해야합니다.

다음 링크는 : 활성 상태로 유지되지 않으므로 페이지 링크시에도 정상 링크로 되돌아갑니다.

Answer 2

예상대로 작동합니다. 나는 활성 상태의 색으로 빨강을 색칠했다.
en 요소를 클릭하고 버튼을 누른 채로 있습니다. 배경이 빨간색으로 표시됩니다.

hover 및 active의 CSS가 동일하기 때문에 변경 사항이 표시되지 않습니다! 위의 정확한 동일한 코드에서 활동 : 마우스를 가져 :

샘플
http://jsfiddle.net/dqH3F/1/

샘플에 대한

#menu2 a:active { 
    background: red url("../images/select.png") left center no-repeat; 
    color: #fff; 
    padding: 9px 16px; 
} 

Answer 3

당신의 배경이 포함되어 있습니다.

활성 상태에서 배경 x 및 y 위치를 설정하려고합니까? http://jsfiddle.net/stursby/9Pccb/