Zastępowanie domyślnych kolorów łączy w przeglądarce internetowej za pomocą CSS

Twórz linki w dowolnym kolorze

Warstwy różnych kolorowych papierów

David Malan / Fotograf's Choice RF / Getty Images





Wszystkie przeglądarki internetowe używają domyślnych kolorów linków, jeśli projektant stron internetowych nie ustawia ich. Aby zmienić te kolory, użyj CSS ( Kaskadowe arkusze stylów ).

Kolory linków

Kolory łączy obejmują kilka różnych stanów:



    Domyślny kolor linku— co widzisz w tekście, zanim wejdziesz w interakcję z linkiem.Kolor linku do najechania kursorem— na co zmienia się link po najechaniu na niego kursorem.Kolor aktywnego linku— po kliknięciu łącza myszą.Obserwowany kolor linku— dla linków, które klikałeś wcześniej.

Użyj CSS, aby zmienić kolory linków

Użycie CSS do zmiany koloru linku wiąże się ze stylizacją ​znacznik :

|_+_|

Dzięki temu CSS niektóre przeglądarki zmienią wszystkie aspekty połączyć (domyślny, aktywny, obserwowany i najechanie) na czarny, podczas gdy inne zmienią tylko domyślny kolor.



Użyj pseudoklasy z dwukropkiem przed nazwą klasy, aby zmienić linki w określonych stanach. Cztery pseudoklasy wpływają na linki.

Aby zmienić domyślny kolor linku:

|_+_|

Aby zmienić aktywny kolor:

|_+_|

Aby zmienić kolor śledzonego linku:



|_+_|

Aby zmienić kolor najechania myszą:

|_+_|

Rozważania

Użyj koloru, aby ułatwić odwiedzającym witrynę znalezienie Twoich linków, nawet jeśli tylko przejrzą stronę. Oto kilka wskazówek:



  • Postaw na kontrast. Link w bardzo jasnym kolorze na białym tle jest trudny do zauważenia, szczególnie dla osób niedowidzących.
  • Postaraj się również o oddzielne kolory dla aktywnych i obserwowanych kolorów, aby odwiedzający witrynę nie byli zdezorientowani, które strony odwiedzili.
  • Zachowaj harmonię kolorów z projektem strony.