Linkkejä käytetään yhdistämään yksi sivu toisiin verkkosivuihin. Linkit samaan väri koska muuta tekstiä on vaikea havaita. CSS:n väriominaisuutta käytetään linkkien värin vaihtamiseen.
CSS:n avulla voimme muotoilla linkit eri tavoin. Voimme asettaa joitain hyperlinkin tiloja, jotka ovat seuraavat:
a:aktiivinen | Sitä käytetään lisäämään tyyliä aktiiviseen elementtiin. |
a:hover | Se lisää elementtiin erikoistehosteita, kun käyttäjä siirtää hiiren osoittimen elementin päälle. |
linkki | Se lisää tyyliä vieraamattomaan linkkiin. |
a:vieraillut | Se lisää tyyliä vierailltuun linkkiin. |
On huomattava, että CSS-määritelmässä a:hover täytyy tulla perässä linkki ja a:vieraillut ja myös a:aktiivinen täytyy tulla sen jälkeen a:hover ollakseen tehokasta.
Hyperlinkin tilojen ilmoittamisjärjestys on annettu seuraavasti:
a:link {color: lightblue;} a:visited {color: #060235} a:hover {color: #FCFC0C} a:active {color: #C0F0FC}
Linkin värin muuttamiseksi meidän on käytettävä väri CSS:n omaisuutta. Värin nimi voidaan antaa missä tahansa kelvollisessa muodossa, kuten värin nimi, rgb()-arvo tai HEX-arvo.
Katsotaanpa nyt, kuinka linkkien väri asetetaan esimerkkien avulla.
Esimerkki
Oletuksena normaalien tai vierailemattomien linkkien väri on sininen. Tässä esimerkissä muutamme linkin oletusväriä käyttämällä väri omaisuutta.
a{ color: brown; } <p> The text <b>javaTpoint.com</b> in the above line is the hyperlink. </p>Testaa nyt
Lähtö
Kun ohjelma suoritetaan, saamme seuraavan näytön.
Hiirtä liikuttaessa linkki näyttää tältä:
Kun linkki on aktiivisessa tilassa, linkin väri on punainen, kuten alla näkyy.