Что такое порядок CSS для зависания и фокусировки поля

Question

Каким будет цвет моего ввода, когда он сфокусирован и завис?

input:hover { 
    color: red; 
} 

input:focus { 
    color: blue; 
} 

Answer 1

Они предположительно находятся в одной таблице стилей и имеют одинаковую специфичность (один псевдокласс и один элемент), поэтому единственным оставшимся шагом в каскадном порядке является заданный порядок. То есть, если он будет парить и сфокусирован, он будет синим.

На Специфичность: http://www.w3.org/TR/CSS2/cascade.html#specificity

Answer 2

input:hover { 
    color: red; 
} 

input:focus { 
    color: blue; 
} 

В demo, поскольку вход ориентирован и CSS имеет :focus в списке последним, вход будет синим.

Если вы reverse those two rule sets, вход будет красным, потому что :hover является последним.

Answer 3

Попробуйте вход: фокус: парить

Normaly мы просто 3 состояния, активный отдых, парят и сосредоточиться. То, что вы хотите, не будет возможным, но попробуйте код выше.