К содержанию

Erreur lors de l'utilisation de plusieurs sélecteurs CSS

Je rappelle une erreur courante des débutants : le sélecteur .bbb.zzz et le sélecteur .bbb .zzz font des choses différentes. Le premier cherche un élément ayant simultanément deux classes, tandis que le second cherche un élément avec la classe zzz, se trouvant à l'intérieur d'un élément de classe bbb.

Задание 1

Expliquez ce que sélectionne le sélecteur dans le code ci-dessous. Ensuite, écrivez le code HTML correspondant à ce sélecteur. Voici le code avec le sélecteur :

cssh2.zzz {
  color: red;
}

Задание 2

Expliquez ce que sélectionne le sélecteur dans le code ci-dessous. Ensuite, écrivez le code HTML correspondant à ce sélecteur. Voici le code avec le sélecteur :

cssh2 .zzz {
  color: red;
}

Задание 3

Expliquez ce que sélectionne le sélecteur dans le code ci-dessous. Ensuite, écrivez le code HTML correspondant à ce sélecteur. Voici le code avec le sélecteur :

css.bbb.zzz {
  color: red;
}

Задание 4

Expliquez ce que sélectionne le sélecteur dans le code ci-dessous. Ensuite, écrivez le code HTML correspondant à ce sélecteur. Voici le code avec le sélecteur :

css.bbb .zzz {
  color: red;
}

Задание 5

Expliquez ce que sélectionne le sélecteur dans le code ci-dessous. Ensuite, écrivez le code HTML correspondant à ce sélecteur. Voici le code avec le sélecteur :

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

Задание 6

Expliquez ce que sélectionne le sélecteur dans le code ci-dessous. Ensuite, écrivez le code HTML correspondant à ce sélecteur. Voici le code avec le sélecteur :

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

Задание 7

Expliquez ce que sélectionne le sélecteur dans le code ci-dessous. Ensuite, écrivez le code HTML correspondant à ce sélecteur. Voici le code avec le sélecteur :

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

Задание 8

Expliquez ce que sélectionne le sélecteur dans le code ci-dessous. Ensuite, écrivez le code HTML correspondant à ce sélecteur. Voici le code avec le sélecteur :

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

Задание 9

Expliquez ce que sélectionne le sélecteur dans le code ci-dessous. Ensuite, écrivez le code HTML correspondant à ce sélecteur. Voici le code avec le sélecteur :

css#elem.bbb {
  color: red;
}

Задание 10

Expliquez ce que sélectionne le sélecteur dans le code ci-dessous. Ensuite, écrivez le code HTML correspondant à ce sélecteur. Voici le code avec le sélecteur :

css#elem .bbb {
  color: red;
}