내용 : 활성 또는 : 호버 작동 여부?

다음과 같은 동작은 무엇입니까? : 및 요소에서 두 요소가 모두 활성화되어 있으면 마우스를 올려 놓습니다. 데모하려면 http://jsfiddle.net/z6v4r/ 코드를 작성했습니다. 분명히 호버가 승자입니다.내용 : 활성 또는 : 호버 작동 여부?

div.abc div.xyz input:hover 
{ 
border: 1px inset rgb(0, 69, 124); 
    border-radius:15px; 
    background-color: rgb(0, 69, 124); 
    color:white; 
} 
div.abc div.xyz input:active,div.abc div.xyz input:focus 
{ 
    border: 1px inset rgb(0, 69, 124); 
    border-radius:15px; 
    background-color:rgba(66, 87, 133, 0.24); 
    outline-style:none; 
}

지금 것은이 모든에

<div class="abc"> <div class="xyz"> <input type="Something"> </input> </div> </div>

CSS : 다른 시나리오에서
(있는 내가 작업 한)
나는 다음과 같은 HTML에 대한 CSS를 썼다 active 나는 active : : focus의 배경색과 hover로부터 오는 폰트 os의 색깔을 얻는다.

이러한 요소가 어떻게 요소에 적용되는지 개념이 필요합니다.

출처

2013-10-04 mandeep

질문이 복잡해집니다. –

동일한 질문 : http://stackoverflow.com/questions/1677990/what-is-the-difference-between-focus-and-active –

[Specificity] (https : // developer .mozilla.org/ko-US/docs/Web/CSS/Specificity), [상속] (https://developer.mozilla.org/en-US/docs/Web/CSS/Inheritance)을 참조하십시오. – robertc

활성은 click 이벤트입니다.

마우스를 들고 있으면 직장에서 자신의 속성을 볼 수 있습니다.

당신은이 register하거나 서버에서 응답을 얻기 위해 또는 다른 페이지로 이동 시간이 걸립니다 login 같은 무거운 프로세스에 유용 toggle element state enter image description here

사용하여 크롬이를 디버깅 할 수 있습니다.

출처

2013-10-04 12:53:29 raam86

hover firstly, then : active에 CSS를 지정했기 때문입니다. CSS는 마침내 오는 가치에 우선합니다. 그래서 당신의 경우에, : 호버 경우에 더 선호하는 것이 나중에 파일에 씁니다.

출처

2013-10-04 13:03:19

입니까? 그들은 서로 다른 의사 클래스이기 때문에 – mandeep

그들은 서로 다른 psedo 클래스이지만 두 클래스가 모두 활성화되면 나중에 지정된 클래스가 작동합니다. –

내용 : 활성 또는 : 호버 작동 여부?

답변

관련 문제