Összetett szelektorok linkállapotokkal CSS-ben
Minden összetett szelektor, amit korábban tanultunk, alkalmazható linkekre is.
Nézzük meg egy példán keresztül. Tegyük fel, hogy a linkjeink
egy adott id-val rendelkező blokkban találhatók:
<div id="block">
<a href="#">link</a>
<a href="#">link</a>
<a href="#">link</a>
</div>
Adjunk stílusokat a blokk linkjeihez:
#block a:link, #block a:visited {
color: red;
}
#block a:hover {
text-decoration: none;
}
Általában a link és a visited
állapotot nem különböztetik meg, ezért a kód
leegyszerűsíthető a következőképpen:
#block a {
color: red;
}
#block a:hover {
text-decoration: none;
}
Magyarázza el, mit választ ki a szelektor az alábbi kódban. Ezután írjon HTML kódot, amely megfelel ennek a szelektornak. Itt a kód a szelektorral:
#test a {
color: red;
}
#test a:hover {
text-decoration: none;
}
