Maison > interface Web > tutoriel CSS > Comment puis-je styliser uniquement le premier mot de chaque paragraphe dans un div spécifique à l'aide de CSS ou de JavaScript ?

Comment puis-je styliser uniquement le premier mot de chaque paragraphe dans un div spécifique à l'aide de CSS ou de JavaScript ?

Mary-Kate Olsen
Libérer: 2024-12-26 03:05:10
original
448 Les gens l'ont consulté

How Can I Style Only the First Word of Each Paragraph Within a Specific Div Using CSS or JavaScript?

Style CSS pour le premier mot des paragraphes dans un div spécifique

Dans ce contexte, vous visez à styliser le premier mot de chaque paragraphe dans le div avec l'ID " contenu" en utilisant CSS. Plus précisément, vous souhaitez définir la taille de police de ce mot sur 14 pt, tout en conservant la taille de police par défaut (12 pt) pour le reste du paragraphe.

Solution CSS (style du premier mot au niveau du paragraphe)

Malheureusement, CSS ne fournit pas de pseudo-élément natif pour cibler le premier mot d'un paragraphe. Les pseudo-éléments :first-letter et :first-line existent, mais ne permettent pas la sélection spécifique du premier mot.

Solution JavaScript (Inline Span Tag)

Pour atteindre l'objectif Pour obtenir l'effet de style souhaité, vous pouvez utiliser JavaScript pour envelopper le premier mot de chaque paragraphe dans une balise span. Cela vous permet de cibler et de modifier indépendamment le style du premier mot. Une telle implémentation JavaScript peut être trouvée sur https://www.dynamicsitesolutions.com/javascript/first-word-selector/.

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