Comment sélectionner le dernier élément sans classe spécifique en CSS ?

Combinaison des sélecteurs :last-child et :not(.class) en CSS

En CSS, le sélecteur :last-child est utilisé pour sélectionner le dernier élément d'une liste d'éléments. Cependant, il n'est pas possible d'utiliser ce sélecteur pour choisir le dernier enfant qui ne possède pas d'attribut de classe spécifique.

Pour y parvenir, on peut essayer d'utiliser le sélecteur suivant :

tr:not(.table_vert_controls):last-child

Malheureusement, ce sélecteur ne fonctionnera pas car :last-child cible spécifiquement le dernier élément d'une liste, et il n'existe pas de pseudo-classe équivalente :last-of-class.

Depuis fin 2015, Selectors 4 introduit une extension aux sélecteurs :nth-child() et :nth-last-child(), permettant une sélection plus complexe. Cette extension inclut la possibilité de passer un sélecteur arbitraire comme argument :

tr:nth-last-child(1 of :not(.table_vert_controls))

Bien que cette approche soit plus détaillée, elle fournit un moyen plus précis et efficace de sélectionner l'élément souhaité. Cependant, il est important de noter que la prise en charge de Selectors 4 est encore limitée.

Pour les navigateurs qui ne prennent pas en charge Selectors 4, une approche alternative consisterait à utiliser un sélecteur JavaScript :

$('tr:not(.table_vert_controls):last')

Ce sélecteur jQuery obtient le même résultat que le sélecteur Selectors 4. Il convient de noter que l'utilisation de JavaScript peut introduire des implications en termes de performances par rapport à une solution purement CSS.

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!