Propriété de Text-Shadow dans CSS

Propriété de Text-Shadow dans CSS
Style de texte est un facteur important utilisé pour améliorer les éléments du site Web. Il comprend divers éléments HTML tels que des liens, des images et des boutons qui doivent être synchronisés et cohérents. Aussi, CSS peut s'assurer que le texte ajouté sur une page Web est bien synchronisé. À cette fin, plusieurs fonctionnalités de texte peuvent être utilisées, notamment la taille du texte, la couleur de la police, l'orientation du texte et la couleur de la police. "ombre de texte"Est également inclus dans la liste de ces propriétés fantastiques.

Cet article discutera du Propriété de Text-Shadow et ses options connexes à l'aide d'exemples appropriés.

Propriété de Text-Shadow dans CSS

Dans CSS, vous pouvez utiliser le «ombre de texte»Propriété pour Ajout d'ombres au Html texte éléments. Il comprend différents types d'ombres qui peuvent être appliquées à l'aide de CSS interne, externe ou en ligne.

La syntaxe de la propriété Text-Shadow dans CSS est donnée ci-dessous.

Syntaxe

Text-shadow: H-Shadow V-Shadow Blur-Radius Couleur | Aucun | Initial |
hériter;

Les attributs de la valeur du texte-shadow sont décrits ci-dessous.

Valeurs requises
h-shadow: Cette valeur est utilisée pour spécifier la position horizontale du texte-shadow. Des valeurs négatives peuvent être utilisées pour déplacer l'ombre vers le côté gauche.

v-shadow: Cette valeur est nécessaire pour définir la position verticale d'une ombre. V-Shadow accepte également les valeurs négatives comme décalées.

Toutes les valeurs mentionnées ci-dessus seront utilisées dans l'exemple donné ci-dessous.

Exemple
Dans l'exemple ci-dessous, nous avons défini «1px" comme "h-shadow" et "3px" comme "y-shadow" valeurs. De plus, la «couleur» du Text-Shadow est spécifiée comme «rouge»:







Effet Text-Shadow!



Sortir

Valeurs facultatives

rampe de flou: Il est utilisé pour brouiller le shadow de texte et sa valeur par défaut est 0.

aucun: Il montre qu'aucun effet d'ombre n'est ajouté au texte.

couleur: Cette option est utilisée pour spécifier la couleur du texte-shadow.

initial: Cette option est utilisée pour spécifier la valeur par défaut de la propriété Text-Shadow.

hériter: Vous pouvez hériter de cette propriété à partir de son élément HTML parental.

Maintenant, examinons quelques exemples liés aux valeurs de shadow de texte fournies fournies.

Exemple: ajouter de la couleur au texte-shadow







Effet de couleur de Text-Shadow



L'exécution du code-donné ci-dessus ajoutera un effet de couleur «orange» au shadow de texte ajouté:

L'exemple suivant montre l'effet flou sur une propriété Text-Shadow.

Exemple: ajout de l'effet flou au texte-shadow







Effet flou du texte-shadow!



Sortir

La propriété Text-Shadow accepte également la liste des ombres séparées par les virgules. L'exemple suivant démontrera la procédure pour effectuer l'opération spécifiée.

Exemple







Texte-shadow avec avec plusieurs lux de texte.



Sortir

Nous avons fourni les informations les plus essentielles liées à l'utilisation de "ombre de texte" propriété en CSS.

Conclusion

Dans CSS, Propriété de Text-Shadow est utilisé pour ajouter des ombres aux éléments de texte HTML. Il est principalement utilisé pour ajouter des couleurs au texte, brouiller son ombre et régler sa position horizontale et verticale. Cet article fournit un guide approfondi sur la procédure d'utilisation des dimensions horizontales et verticales de la shadow de texte, de brouiller le texte du texte et enfin d'utiliser des couleurs avec la propriété Text-Shadow de CSS.