Több CSS szelektor egymás után

Ahhoz, hogy egy olyan elemet válasszunk ki, amely egyszerre több szelektor feltételének megfelel, ezeket a szelektorokat egymás után, szóköz nélkül kell írni.

Például a következő szelektor kiválasztja azt az elemet, amelynek egyszerre van bbb osztálya és zzz osztálya:

css.bbb.zzz {
  
}

A következő szelektor pedig kiválasztja a h2 címsort, amelynek egyszerre van bbb osztálya és zzz osztálya:

cssh2.bbb.zzz {
  
}

Ez alapján tetszőleges szelektor-konstrukciókat hozhatunk létre. Az alkalmazott szelektorok sorrendje nem számít, kivéve azt a szabályt, hogy a tag szelektorokat legelöl kell elhelyezni.

Vagyis például a .bbb.zzz és a .zzz.bbb szelektorok teljesen egyenértékűek.

Ezen kívül létrehozhatunk szelektorokat id használatával is, például ilyeneket: #elem.eee, vagy h2#elem.eee, vagy h2.eee#elem, és így tovább.

Задание 1

Magyarázza el, mit választ ki az alábbi kódban található szelektor. Ezután írjon HTML kódot, amely megfelel ennek a szelektorának. Itt a szelektoros kód:

css.bbb.zzz {
  color: red;
}
Задание 2

Magyarázza el, mit választ ki az alábbi kódban található szelektor. Ezután írjon HTML kódot, amely megfelel ennek a szelektorának. Itt a szelektoros kód:

cssh2.bbb.zzz {
  color: red;
}
Задание 3

Magyarázza el, mit választ ki az alábbi kódban található szelektor. Ezután írjon HTML kódot, amely megfelel ennek a szelektorának. Itt a szelektoros kód:

css#elem.bbb {
  color: red;
}
Задание 4

Magyarázza el, mit választ ki az alábbi kódban található szelektor. Ezután írjon HTML kódot, amely megfelel ennek a szelektorának. Itt a szelektoros kód:

css#elem.bbb.zzz {
  color: red;
}
Задание 5

Magyarázza el, mit választ ki az alábbi kódban található szelektor. Ezután írjon HTML kódot, amely megfelel ennek a szelektorának. Itt a szelektoros kód:

cssh2#elem.bbb {
  color: red;
}