Faire le premier personnage en majuscules dans CSS
Ce message vous guidera:
- Comment ajuster les cas de texte dans CSS?
- Comment faire le premier personnage en majuscule de "
”Élément de CSS?
- Comment faire le premier personnage en majuscule de "”Élément de CSS?
Comment ajuster les cas de texte dans CSS?
Les cas de texte sont ajustés en CSS en utilisant le «transformation de texte" propriété. Cette propriété fournit cinq valeurs différentes:
- "capitaliser«La valeur est utilisée pour capitaliser la première lettre de chaque mot.
- "supérieur»La valeur fait chaque lettre en majuscules.
- "inférieur»Modifie toutes les lettres en minuscules.
- "hériter»Applique le cas de texte du parent à l'élément.
- "aucun»La valeur ne modifie pas le cas de texte.
Comment faire le premier personnage en majuscule de "
”Élément de CSS?
Le CSS "transformation de texte«Propriété avec la valeur»capitaliser"Est utilisé pour capitaliser la première lettre de chaque mot. Cependant, nous pouvons utiliser le «::première lettre”Pseudo-classe pour capitaliser uniquement la première lettre.
Comprenons à travers les exemples.
Exemple 1: Capitaliser la première lettre de chaque mot
En html, ajouter "
tutoriels LinuxHint
Écriture d'articles
montage vidéo
conception graphique
Style "
" Élément
pTransform de texte: capitaliser;
Le "transformation de texte"La propriété se voit attribuer la valeur"capitaliser«Pour capitaliser la première lettre de chaque mot du paragraphe.
Sortir
Exemple 2: Capitaliser la seule première lettre du premier mot
Le pseudo-sélectionneur «::première lettre"Est utilisé pour sélectionner la première lettre uniquement. À cette fin, accédez au «p«Élément avec pseudo-classe et utilisez le«transformation de texte" propriété:
P :: Première lettreTransform de texte: capitaliser;
Sortir
Comment faire le premier personnage en majuscules d'élément dans CSS?
Voyons comment capitaliser le premier caractère des éléments en ligne, tels que le «" élément. À cette fin, ajouter "«Éléments et attribuez-leur le«classe" et "href" les attributs:
= "Linux" HREF = "#"> Tutoriels LinuxHint= "Linux" href = "#"> Écriture d'article
= "Linux" href = "#"> Design graphique
Style «A» Éléments
Accédez à l'élément «A» à l'aide du nom de classe «linux»Et appliquez le«transformation de texte«Propriété sur eux:
.LinuxTransform de texte: capitaliser;
Sortir
Comme l'élément «» est en ligne, ils sont ajustés les uns des autres en une seule ligne. Pour faire leur seul premier personnage majuscule et leur affichage comme niveau de bloc, appliquez le CSS "afficher«Propriété avec la valeur»bloc»:
.Linuxbloc de visualisation;
Maintenant, utilisez le «::première lettre»Pseudo-Selector ainsi que l'attribut de classe de l'élément« A »pour capitaliser uniquement la première lettre:
.Linux :: First-LetterTransform de texte: capitaliser;
La sortie indique que nous avons réussi à faire le premier caractère majuscule de l'élément dans CSS.
Conclusion
Pour créer le premier caractère majuscule, premièrement, ajouter des éléments au document HTML pour spécifier un contenu texte, tel que «
»Et« »éléments. Le pseudo-sélectionneur «::première lettre"Est utilisé pour sélectionner la première lettre du texte de l'élément. Ensuite, dans la pseudo-classe, appliquez le CSS "transformation de texte«Propriété avec la valeur»capitaliser”Pour faire la première lettre en majuscule. Cet article a expliqué comment faire le premier personnage en majuscules en utilisant CSS.