Flera selektorer ihop i CSS
För att välja ett element som samtidigt matchar flera selektorer, måste du skriva dessa selektorer ihop, utan mellanslag.
Till exempel kommer följande selektor att välja ett element
som samtidigt har klassen bbb och klassen
zzz:
.bbb.zzz {
}
Och följande selektor kommer att välja en rubrik h2,
som samtidigt har klassen bbb och klassen
zzz:
h2.bbb.zzz {
}
På detta sätt kan du konstruera godtyckliga kombinationer av selektorer. Ordningen på de använda selektorerna spelar ingen roll, förutom regeln att taggselektorer måste placeras i början.
Det vill säga, till exempel är selektorerna .bbb.zzz
och .zzz.bbb helt ekvivalenta.
Dessutom kan du skapa selektorer med
id, till exempel sådana som:
#elem.eee, eller h2#elem.eee,
eller h2.eee#elem och så vidare.
Berätta vad selektorn väljer i koden nedan. Skriv sedan HTML-kod som passar till denna selektor. Här är koden med selektorn:
.bbb.zzz {
color: red;
}
Berätta vad selektorn väljer i koden nedan. Skriv sedan HTML-kod som passar till denna selektor. Här är koden med selektorn:
h2.bbb.zzz {
color: red;
}
Berätta vad selektorn väljer i koden nedan. Skriv sedan HTML-kod som passar till denna selektor. Här är koden med selektorn:
#elem.bbb {
color: red;
}
Berätta vad selektorn väljer i koden nedan. Skriv sedan HTML-kod som passar till denna selektor. Här är koden med selektorn:
#elem.bbb.zzz {
color: red;
}
Berätta vad selektorn väljer i koden nedan. Skriv sedan HTML-kod som passar till denna selektor. Här är koden med selektorn:
h2#elem.bbb {
color: red;
}
