Voici quelques titres basés sur des questions qui correspondent au contenu de l'article : Se concentrer sur la différence fondamentale : * Pourquoi « .class:last-of-type » ne fonctionne-t-il pas comme « .class:last-of-class » ? * Quel est le vrai comportement

Comprendre le comportement de .class:last-of-type

Le problème rencontré est que le sélecteur .class:last-of- type ne fonctionne pas comme un sélecteur .class:last-of-class. Au lieu de cela, il cible spécifiquement les éléments qui sont le dernier frère de leur type dans un élément conteneur.

Comprendre .last-of-type

Selon la spécification du W3C, la pseudo-classe .last-of-type représente les éléments qui sont le dernier frère de leur type. Cela signifie que :

1. Il vérifie les listes d'éléments dans chaque élément conteneur dans le HTML.
2. Il identifie le dernier élément de chaque liste.
3. Il vérifie que le dernier élément correspond au type d'élément spécifié (par exemple, p).

Application des règles

Dans l'exemple fourni, le sélecteur .visible:last -of-type est utilisé. Cela signifie que les styles ne seront appliqués qu'à :

• Éléments qui sont une balise p.
• Éléments qui ont la classe .visible.
• Éléments qui sont la dernière balise p avec la classe .visible dans leur élément conteneur.

Résoudre le problème

Puisque seuls les deux premiers éléments p ont la classe .visible, le troisième élément p ne répondra pas aux critères du sélecteur .visible:last-of-type. Par conséquent, sa propriété d'affichage ne sera pas définie sur blocage.

Pour obtenir le résultat souhaité, envisagez les options suivantes :

• Assurez-vous que le résultat final La balise p possède également la classe .visible.
• Si JavaScript ne peut pas être utilisé, explorez des approches CSS alternatives pour sélectionner le dernier élément p avec une classe spécifique.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!