Бисёр селекторҳо якҷоя дар CSS

Барои интихоб кардани унсуре, ки ҳамзамон ба чанд селектор мувофиқат мекунад, бояд ин селекторҳоро бе фосила якҷоя навишт.

Масалан, селектори зерин унсуреро интихоб мекунад, ки ҳамзамон синфи bbb ва синфи zzz-ро дорад:

css.bbb.zzz {
  
}

Ва селектори зерин сарлавҳаи h2-ро интихоб мекунад, ки ҳамзамон синфи bbb ва синфи zzz-ро дорад:

cssh2.bbb.zzz {
  
}

Бо ин роҳ метавон сохтҳои ихтиёрии селекторҳоро сохт. Дар ин ҳол тартиби селекторҳои истифодашуда аҳаммият надорад, ба истиснои қоидае, ки селекторҳои тегҳоро бояд дар охири саф гузошт.

Яъне, масалан, селекторҳои .bbb.zzz ва .zzz.bbb комилан баробар ҳастанд.

Ғайр аз ин, метавон селекторҳоро бо истифода аз id сохт, масалан, чунинҳо: #elem.eee, ё h2#elem.eee, ё h2.eee#elem ва ғайра.

Задание 1

Ба мо бигӯед, ки селектор дар рамзи дар поён овардашуда чиро интихоб мекунад. Сипас рамзи HTML-ро нависед, ки ба ин селектор мувофиқат кунад. Инҷо рамз бо селектор аст:

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

Ба мо бигӯед, ки селектор дар рамзи дар поён овардашуда чиро интихоб мекунад. Сипас рамзи HTML-ро нависед, ки ба ин селектор мувофиқат кунад. Инҷо рамз бо селектор аст:

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

Ба мо бигӯед, ки селектор дар рамзи дар поён овардашуда чиро интихоб мекунад. Сипас рамзи HTML-ро нависед, ки ба ин селектор мувофиқат кунад. Инҷо рамз бо селектор аст:

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

Ба мо бигӯед, ки селектор дар рамзи дар поён овардашуда чиро интихоб мекунад. Сипас рамзи HTML-ро нависед, ки ба ин селектор мувофиқат кунад. Инҷо рамз бо селектор аст:

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

Ба мо бигӯед, ки селектор дар рамзи дар поён овардашуда чиро интихоб мекунад. Сипас рамзи HTML-ро нависед, ки ба ин селектор мувофиқат кунад. Инҷо рамз бо селектор аст:

cssh2#elem.bbb {
  color: red;
}