2009-10-08 19 views
8

Jaka jest prawidłowa kolejność stylizacji elementu <a> (łącze, odwiedzone, najechanie, aktywne). Wszystkie są mylące, zapewniając różne połączenie, takie jak LVHA, LAHV. Czy ktoś może podać prawidłowe zamówienie?Kolejność linków w css

Odpowiedz

15

link odwiedzone aktywowaniem usługi Active

Cytując z CSS specification:

a:link { color: red } /* unvisited links */ 
a:visited { color: blue } /* visited links */ 
a:hover { color: yellow } /* user hovers  */ 
a:active { color: lime } /* active links */ 

Należy zauważyć, że A: hover muszą być umieszczone po A: link i A: visited zasady, ponieważ w przeciwnym razie Reguły kaskadowania ukryją właściwość "kolor" reguły "A": hover. Podobnie, ponieważ A: aktywny jest umieszczony po A: najechanie, aktywny kolor (wapno) będzie obowiązywał, gdy użytkownik zarówno aktywuje i wisi nad elementem A.

+0

Po odwiedzeniu okazuje się, że wszystkie łącza są kolorowe, a kolory odwiedzane. Dlaczego tak się stało? – ArK

+0

Ponieważ odwiedzałeś już wszystkie linki? Tylko zgadnij ... – Joey

+0

nie dzieje się nowo załadowana strona. – ArK

3

Możesz również preferować zamawianie VLHA, co nie ma znaczenia. Jednak specyfikacja CSS określała zamawianie LVHA i w rzeczywistości jest łatwa do zapamiętania: i LoVeHA!

+0

Śliczne mnemoniki! +1 –

+1

Wypróbuj to, 'LoVe ​​/ HAte', skopiowane z Pro CSS Techniques. –

1

Oto najlepszy porządek, szczególnie w przypadku pseudo klas. A L V VH H a (wymawiać Al'va Ha ')

a    { color: white; text-decoration: none; }     /* bookmark */ 
a:link   { color: red; }           /* regular link */ 
a:visited  { color: green; text-decoration: strikethrough; }  /* visited link */ 
a:visited:hover { color: blue; text-decoration: underline overline; } /* visted hover link */ 
a:hover  { color: yellow; text-decoration: underline overline; } /* hover link */ 
a:active  { color: orange; text-decoration: underline overline; } /* active link */ 

Dzięki temu obie odwiedzonych stanów i oba razem unosić stanów jak przebywających w określonej kolejności. Pozwala też na stylizacji zakładek takich jak

<a name="bookmark_name">Bookmark Text</a> 

które można kierować z

<a href="bookmark_name">Link Text</a> 

Uważam to jest wielki dla łącząc prawo do części witryny, ale gdzie ty nie chcesz zakładka, aby mieć styl automatycznego najechania, który będzie oznaczać, ponieważ jest to znacznik zakotwiczenia.

Powiązane problemy