Maison > interface Web > tutoriel CSS > Comment puis-je styliser la première instance d'un type d'élément spécifique dans l'ensemble d'un document HTML ?

Comment puis-je styliser la première instance d'un type d'élément spécifique dans l'ensemble d'un document HTML ?

Linda Hamilton
Libérer: 2024-12-16 20:43:18
original
863 Les gens l'ont consulté

How Can I Style the First Instance of a Specific Element Type Across an Entire HTML Document?

Faire correspondre le premier élément d'un certain type dans l'ensemble du document

Styliser le premier élément d'un type spécifique sur l'ensemble d'un document HTML peut être un défi en utilisant CSS seul. La pseudo-classe :first-of-type est limitée à faire correspondre le premier élément d'un type au sein de son élément parent.


JavaScript Solutions

:premier-de-type

Pour obtenir une correspondance à l'échelle du document du premier élément d'un type, un Une solution JavaScript est nécessaire.

Nous pouvons utiliser document.querySelector() pour sélectionner le premier élément correspondant dans l'ensemble du document et lui appliquer une classe personnalisée, qui peut ensuite être stylisée avec CSS.

<p>&lt ;p>Le CSS suivant stylisera ensuite le premier paragraphe avec la classe ajoutée :</p></p>
<p><pre class="brush:php;toolbar:false"> background : rose;<br>}

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!

source:php.cn
Déclaration de ce site Web
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
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal