Maison > interface Web > tutoriel CSS > Comment puis-je ajouter une couleur d'arrière-plan uniquement au texte à l'aide de CSS ?

Comment puis-je ajouter une couleur d'arrière-plan uniquement au texte à l'aide de CSS ?

Linda Hamilton
Libérer: 2024-12-12 16:53:14
original
480 Les gens l'ont consulté

How Can I Add a Background Color Only to Text Using CSS?

Comment définir une couleur d'arrière-plan pour la largeur du texte à l'aide de CSS

Dans votre quête visant à créer un arrière-plan vert derrière uniquement votre texte et non le sur toute la largeur de la page, vous êtes confronté à un défi. Voici comment naviguer dans cette situation tout en respectant les contraintes que vous avez mentionnées :

Solution :Enveloppez votre texte dans un élément en ligne

Puisque vous ne pouvez pas modifier le HTML, enveloppez votre texte dans un élément en ligne, tel qu'un .

<h1><span>The Last Will and Testament of Eric Jones</span></h1>
Copier après la connexion

Maintenant, vous pouvez appliquer la couleur d'arrière-plan au élément en ligne :

h1 {
    text-align: center; 
}
h1 span { 
    background-color: green; 
}
Copier après la connexion

La justification :

Les éléments en ligne se rétrécissent pour s'adapter à leur contenu, garantissant que la couleur d'arrière-plan s'aligne parfaitement avec la largeur du texte. Cette technique vous permet de créer un effet de fond spécifiquement pour votre texte sans impacter les éléments environnants.

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