К содержанию

Bir neçə CSS seçicisi istifadə edərkən səhv

Yeni başlayanların etdiyi səhvi xatırladıram: seçici .bbb.zzz və seçici .bbb .zzz fərqli şeylər edir. Birincisi eyni zamanda iki sinfi olan elementi axtarır, ikincisi isə bbb sinfinin içindəki zzz sinfi olan elementi axtarır.

Задание 1

Aşağıdakı kodda seçicinin nə seçdiyini izah edin. Sonra bu seçiciyə uyğun gələn HTML kodunu yazın. Selektor olan kod budur:

cssh2.zzz {
  color: red;
}

Задание 2

Aşağıdakı kodda seçicinin nə seçdiyini izah edin. Sonra bu seçiciyə uyğun gələn HTML kodunu yazın. Selektor olan kod budur:

cssh2 .zzz {
  color: red;
}

Задание 3

Aşağıdakı kodda seçicinin nə seçdiyini izah edin. Sonra bu seçiciyə uyğun gələn HTML kodunu yazın. Selektor olan kod budur:

css.bbb.zzz {
  color: red;
}

Задание 4

Aşağıdakı kodda seçicinin nə seçdiyini izah edin. Sonra bu seçiciyə uyğun gələn HTML kodunu yazın. Selektor olan kod budur:

css.bbb .zzz {
  color: red;
}

Задание 5

Aşağıdakı kodda seçicinin nə seçdiyini izah edin. Sonra bu seçiciyə uyğun gələn HTML kodunu yazın. Selektor olan kod budur:

css.bbb.zzz.xxx {
  color: red;
}

Задание 6

Aşağıdakı kodda seçicinin nə seçdiyini izah edin. Sonra bu seçiciyə uyğun gələn HTML kodunu yazın. Selektor olan kod budur:

css.bbb .zzz.xxx {
  color: red;
}

Задание 7

Aşağıdakı kodda seçicinin nə seçdiyini izah edin. Sonra bu seçiciyə uyğun gələn HTML kodunu yazın. Selektor olan kod budur:

css.bbb.zzz .xxx {
  color: red;
}

Задание 8

Aşağıdakı kodda seçicinin nə seçdiyini izah edin. Sonra bu seçiciyə uyğun gələn HTML kodunu yazın. Selektor olan kod budur:

css.bbb .zzz .xxx {
  color: red;
}

Задание 9

Aşağıdakı kodda seçicinin nə seçdiyini izah edin. Sonra bu seçiciyə uyğun gələn HTML kodunu yazın. Selektor olan kod budur:

css#elem.bbb {
  color: red;
}

Задание 10

Aşağıdakı kodda seçicinin nə seçdiyini izah edin. Sonra bu seçiciyə uyğun gələn HTML kodunu yazın. Selektor olan kod budur:

css#elem .bbb {
  color: red;
}