Czy ktoś może wyjaśnić, dlaczego selektor "n-dziecko" ma wyższy priorytet niż "najeżdżanie"?

Wczoraj natknąłem się na to: Jeden z moich :hover -states przestał działać. I okazało się, że jeśli to zmienić:Czy ktoś może wyjaśnić, dlaczego selektor "n-dziecko" ma wyższy priorytet niż "najeżdżanie"?

div.item {} 
div.item:hover {} 
div.item:nth-child(even) {}

do tego:

div.item {} 
div.item:nth-child(even) {} 
div.item:hover {}

działa ponownie.

Utworzono demo on jsfiddle, aby pokazać oba przypadki.

Czy ktoś może wyjaśnić, dlaczego :hover -state jest nadpisane przez selektor?

Źródło

2012-10-24 insertusernamehere

Selektory mają to samo specificity, więc ten, który pojawia się jako ostatni, ma pierwszeństwo.

Źródło

2012-10-24 18:44:09 Guffa

+1 Dziękuję, dokładnie to, czego szukałem. Sądziłem, że w pseudoklasach wciąż istnieje hierarchia. – insertusernamehere

@insertusernametutaj: Nie, jedyną pseudoklasą, która jest zwolniona ze zwykłego obliczenia, jest ': not()', która zamiast tego przyjmuje specyfikę swojego argumentu. Oznacza to, że specyficzność ': not (E)' to 'E', a nie': not() '. – BoltClock

@BoltClock Ah, więc istnieje co najmniej jeden wyjątek. Dzięki za te dodatkowe informacje. – insertusernamehere

Aby nadpisać równą specyficzność można Łańcuch selektorów

div.container_2 > div:nth-child(even):hover { 
    background: red; 
}

Źródło

2012-10-24 18:47:30

'div.item: nth-child (even): hover' wystarczy, aby zwiększyć specyfikę - nie trzeba wybierać przez rodzica. – BoltClock

@BoltClock dzięki, masz rację. Moje umieszczenie na końcu stylu w skrzypcach sprawiło, że wyglądało to bardziej konkretnie. –

Czy ktoś może wyjaśnić, dlaczego selektor "n-dziecko" ma wyższy priorytet niż "najeżdżanie"?

Odpowiedz

Powiązane problemy