:heading()
Limited availability
Cette fonctionnalité n'est pas Compatible car elle ne fonctionne pas dans certains des navigateurs les plus utilisés.
Expérimental: Il s'agit d'une technologie expérimentale.
Vérifiez attentivement le tableau de compatibilité des navigateurs avant de l'utiliser en production.
La fonction de pseudo-classe CSS :heading() représente tous les éléments de titre qui correspondent à une valeur calculée à l'aide de la notation An+B. Cela vous permet de mettre en forme des éléments à des niveaux de titre spécifiques en même temps, plutôt que de les correspondre et de les mettre en forme individuellement.
Note :
La fonction :heading() a la même spécificité qu'un sélecteur de classe, c'est-à-dire 0-1-0. Ainsi, :heading() aurait une spécificité de 0-1-0, et section:heading() aurait une spécificité de 0-1-1.
Syntaxe
:heading( <integer># ) {
/* ... */
}
Paramètres
La fonction de pseudo-classe :heading() prend une liste séparée par des virgules d'entiers (<integer>) qui représentent les niveaux de titre à mettre en forme.
Notes d'utilisation
La pseudo-classe fonctionnelle :heading() ne correspond qu'aux éléments qui sont sémantiquement reconnus comme des titres. Elle ne correspond pas aux éléments qui utilisent les attributs role="heading" ou 'aria-level'.
Le niveau de titre utilisé par :heading() peut être différent du sélecteur de type d'un élément dans les cas où le navigateur calcule un niveau de titre exposé différent. Par exemple, h1:heading(3) correspondra à tout élément <h1> exposé comme un titre de niveau 3.
Exemples
Sélectionner un titre spécifique
Dans cet exemple, une liste de valeurs séparées par des virgules est utilisée pour cibler les titres de niveaux impairs (<h1> et <h3>) et de niveaux pairs (<h2> et <h4>).
<h1>Entête 1</h1>
<h2>Entête 2</h2>
<h3>Entête 3</h3>
<h4>Entête 4</h4>
:heading(1, 3) {
color: tomato;
}
:heading(2, 4) {
color: slateblue;
}
Spécifications
| Specification |
|---|
| Selectors Level 5 # headings |
Compatibilité des navigateurs
Voir aussi
- La pseudo-classe
:heading