Propriété de transformation de texte dans CSS

Le texte est l'une des parties les plus importantes de toute page Web. Chaque site Web a du texte dans l'une ou l'autre forme i.e. Il peut s'agir d'un paragraphe, de titres, etc. Par conséquent, CSS fournit un large éventail de propriétés de texte pour le style et la mise en forme du texte tels que le texte-alignement, le texte du texte, la transformation de texte, etc.

Toutes ces propriétés remplissent différentes fonctionnalités, par exemple, le texte-aligne détermine l'alignement du texte I.e. Centre, à droite, à gauche, etc. La propriété de couleur texte définit la couleur du texte i.e. Rouge, vert, etc., et ainsi de suite. Cependant, cet article se concentrera sur la propriété de transformation de texte.

Cet article présente un aperçu détaillé de la propriété de transformation de texte ainsi que quelques exemples.

Propriété de transformation de texte

Une propriété CSS la plus couramment utilisée qui détermine l'apparence du texte en termes de texte de texte I.e. si le texte sera en minuscules ou en majuscules. De plus, il peut également être utilisé pour capitaliser le caractère initial de chaque mot.

Le fonctionnement des valeurs suivantes sera discuté dans cet article à l'aide d'exemples:

• majuscule: Convertit tous les caractères du texte en majuscules.
• minuscule: Convertit tous les caractères du texte en minuscules.
• capitaliser: Convertit le caractère initial de chaque mot en majuscule.
• aucun: Il montre le comportement par défaut de la propriété de transformation de texte I.e. Le texte sera affiché de la même manière qu'il est écrit.

Comment utiliser la valeur majuscule pour la propriété de transformation de texte

La valeur majuscule transforme tous les caractères en majuscules

Exemple
Dans cet exemple, le texte est un mélange de lettres majuscules et minuscules. Cependant, l'attribution de la valeur majuscule à la propriété de transformation de texte transformera chaque lettre en majuscule:

Html

Propriété de transformation de texte

Ceci est le premier paragraphe

C'est le deuxième paragraphe

C'est le troisième paragraphe

CSS

Nous obtiendrons la sortie suivante:

Chaque lettre est transformée en la lettre majuscule.

Comment utiliser la valeur des minuscules pour la propriété de transformation de texte

Il convertira chaque caractère du texte en minuscules.

Exemple

Dans le code indiqué ci-dessous, la première lettre de chaque mot est une lettre majuscule, mais l'attribution de la valeur minuscule à la propriété de transformation de texte transformera tout le texte en minuscules:

Html

Propriété de transformation de texte

Ceci est le premier paragraphe

C'est le deuxième paragraphe

C'est le troisième paragraphe

CSS

Le code ci-dessus génère la sortie suivante:

Chaque lettre est transformée en la lettre minuscule.

Comment utiliser la valeur de capitalisation des biens de transformation de texte

Comme le nom lui-même le suggère, il a capitalisé la première lettre de chaque mot. L'exemple ci-dessous montrera le fonctionnement de la valeur de capitalisation.

Exemple

Dans le script ci-dessous, chaque lettre du document est en minuscules et la valeur Capitaize est utilisée pour l'élément H2, il convertira donc la première lettre de chaque mot en capital:

Html

Propriété de transformation de texte

Ceci est le premier paragraphe

c'est le deuxième paragraphe

c'est le troisième paragraphe

CSS

Le code ci-dessus génère la sortie suivante:

La première lettre de chaque mot est transformée en lettre majuscule.

Comment utiliser aucune valeur pour la propriété de transformation de texte

Le aucun La valeur empêche tout le texte de la transformation de texte i.e. il rend tous les personnages tels que. L'exemple ci-dessous vous permettra de comprendre comment utiliser "aucun”Valeur pour la propriété de transformation de texte.

Exemple

Le morceau de code suivant implémente la propriété de transformation de texte sur un élément P, H2:

Html

Propriété de transformation de texte

Ceci est le premier paragraphe

C'est le deuxième paragraphe

C'est le troisième paragraphe

CSS

Le code ci-dessus ne modifierait pas l'apparence du texte:

Tout le texte reste inchangé.

Conclusion

CSS fournit une propriété de transformation de texte pour contrôler la transformation de texte I.e. Les minuscules et les majuscules convertissent toutes les lettres en minuscules et en majuscules respectivement et la valeur aucune rend le texte dans le cas par défaut. La propriété capitalisée rend le premier caractère de chaque mot en majuscules.

Cet article explique comment utiliser la propriété de transformation de texte. Quelles sont les valeurs qui peuvent être utilisées pour la propriété de transformation de texte et comment ces valeurs affectent-elles l'apparence du texte?