Flere selektorer sammen i CSS
For å velge et element som samtidig oppfyller flere selektorer, må du skrive disse selektorene sammen, uten mellomrom.
For eksempel, vil følgende selektor velge et element
som samtidig har klassen bbb og klassen
zzz:
.bbb.zzz {
}
Og følgende selektor vil velge overskriften h2,
som samtidig har klassen bbb og klassen
zzz:
h2.bbb.zzz {
}
På denne måten kan du konstruere vilkårlige kombinasjoner av selektorer. Rekkefølgen av de brukte selektorene spiller ingen rolle, bortsett fra regelen om at tag-selektorer må stå helt i begynnelsen.
Det vil si, for eksempel, er selektorene .bbb.zzz
og .zzz.bbb fullstendig likeverdige.
I tillegg kan du lage selektorer med
bruk av id, for eksempel slike:
#elem.eee, eller h2#elem.eee,
eller h2.eee#elem og så videre.
Forklar hva selektoren i koden nedenfor velger. Skriv deretter HTML-kode som passer med denne selektoren. Her er koden med selektoren:
.bbb.zzz {
color: red;
}
Forklar hva selektoren i koden nedenfor velger. Skriv deretter HTML-kode som passer med denne selektoren. Her er koden med selektoren:
h2.bbb.zzz {
color: red;
}
Forklar hva selektoren i koden nedenfor velger. Skriv deretter HTML-kode som passer med denne selektoren. Her er koden med selektoren:
#elem.bbb {
color: red;
}
Forklar hva selektoren i koden nedenfor velger. Skriv deretter HTML-kode som passer med denne selektoren. Her er koden med selektoren:
#elem.bbb.zzz {
color: red;
}
Forklar hva selektoren i koden nedenfor velger. Skriv deretter HTML-kode som passer med denne selektoren. Her er koden med selektoren:
h2#elem.bbb {
color: red;
}