Monimutkaiset valitsimet linkkien tiloilla CSS:ssä
Kaikkia monimutkaisia valitsimia, joita olemme aiemmin oppineet, voidaan soveltaa myös linkkeihin.
Katsotaanpa esimerkkiä. Oletetaan, että linkkimme
ovat lohkossa, jolla on määritetty
id:
<div id="block">
<a href="#">link</a>
<a href="#">link</a>
<a href="#">link</a>
</div>
Määritetään tyylit tämän lohkon linkeille:
#block a:link, #block a:visited {
color: red;
}
#block a:hover {
text-decoration: none;
}
Yleensä link- ja visited
tiloja ei erotella, joten koodia voidaan yksinkertaistaa
seuraavasti:
#block a {
color: red;
}
#block a:hover {
text-decoration: none;
}
Kerro, mitä valitsin valitsee alla olevassa koodissa. Kirjoita sitten HTML-koodi, joka sopii tähän valitsimeen. Tässä on koodi valitsimella:
#test a {
color: red;
}
#test a:hover {
text-decoration: none;
}
