Pseudo-classe :first-child CSS

Définition et utilisation

CSS :first-child Les pseudo-classes sont utilisées pour sélectionner les éléments qui sont le premier enfant de leur élément parent (dans un ensemble d'éléments frères).

Exemple

Exemple 1

Sélectionnez et définissez le style de chaque élément <p> qui est le premier enfant de son élément parent :

p:first-child {
  background-color: yellow;
}

Essayer vous-même

Exemple 2

Sélectionnez et définissez le style de chaque élément <i> qui est le premier enfant de son élément parent :

i:first-child {
  background: yellow;
}

Essayer vous-même

Exemple 3

Sélectionnez et définissez le style de chaque premier élément <li> de la liste :

li:first-child {
  background: yellow;
}

Essayer vous-même

Exemple 4

Sélectionnez et définissez le style de chaque premier enfant de l'élément <ul> :

ul > :first-child {
  background: yellow;
}

Essayer vous-même

Syntaxe CSS

:first-child {
  déclarations css;
}

Détails techniques

Version : CSS3

Prise en charge du navigateur

Les nombres dans le tableau indiquent la première version du navigateur qui prend en charge ce pseudo-classe.

Chrome Edge Firefox Safari Opera
4.0 7.0 3.0 3.1 9.6

Pages associées

Tutoriel CSS :Pseudo-classe CSS