Maison >interface Web >tutoriel CSS >Comment sélectionner tous les enfants d'un élément sauf le dernier en CSS ?

Comment sélectionner tous les enfants d'un élément sauf le dernier en CSS ?

Patricia Arquette
Patricia Arquetteoriginal
2024-11-14 20:10:031024parcourir

How to Select All Children of an Element Except the Last One in CSS?

Sélection de tous les enfants d'un élément à l'exception du dernier enfant

La sélection d'éléments à l'aide de sélecteurs CSS est une technique puissante pour styliser et manipuler des pages Web. Une tâche courante consiste à sélectionner tous les enfants d'un élément à l'exception du dernier enfant.

Le sélecteur :last-child

Pour sélectionner uniquement le dernier enfant d'un élément, le :le sélecteur du dernier enfant peut être utilisé. Ce sélecteur correspond uniquement aux éléments qui sont le dernier enfant de leur élément parent. Par exemple :

div:nth-last-child(1) {
  /* styles */
}

Sélection de tous les enfants sauf le dernier

Pour sélectionner tous les enfants d'un élément sauf le dernier, la pseudo-classe de négation :not() peut être combiné avec la pseudo-classe :last-child. La pseudo-classe :not() correspond aux éléments qui ne correspondent pas à la condition spécifiée. Dans ce cas, la condition est :last-child, ce qui signifie que la pseudo-classe :not() correspondra à tous les éléments qui ne sont pas le dernier enfant de leur élément parent.

:not(:last-child) {
  /* styles */
}

Ce sélecteur correspond à tous les enfants de l'élément parent sauf le dernier enfant. Les styles appliqués au sélecteur seront appliqués à tous les éléments correspondants.

Compatibilité

Il est important de noter que la pseudo-classe :not() n'est pas prise en charge dans IE8 ou versions antérieures d'Internet Explorer. Pour les navigateurs qui ne prennent pas en charge :not(), des méthodes alternatives pour sélectionner tous les enfants sauf le dernier peuvent être utilisées, comme l'utilisation du sélecteur de nième enfant ou des combinateurs d'enfants.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn