Pouvez-vous mettre en majuscule le texte après l'avoir mis en minuscule avec CSS ?

Mise en majuscule du texte après la mise en minuscule avec CSS

Question : Est-il possible de mettre d'abord le texte en minuscule, puis de le mettre en majuscule en utilisant CSS ?

Exemple :

• HELLO WORLD → Hello World

Contexte supplémentaire : Vous avez une liste de pays en majuscules (par exemple, ROYAUME-UNI) et doivent les convertir en minuscules (par exemple, Royaume-Uni).

Réponse :

Oui, CSS fournit une solution pour cette tâche :

<code class="css">.className {
  text-transform: capitalize;
}</code>

Ce CSS applique la propriété text-transform: capitalize à l'élément avec la classe className, convertissant automatiquement toutes les lettres minuscules en majuscules et la première lettre de chaque mot en minuscules.

Solution alternative utilisant JavaScript :

Si CSS n'est pas une option, vous pouvez utiliser JavaScript pour obtenir le même résultat :

<code class="javascript">function capitalize(s) {
  return s.toLowerCase().replace(/\b./g, function (a) {
    return a.toUpperCase();
  });
}

capitalize('this IS THE wOrst string eVeR');</code>

Le La fonction capitalize prend une chaîne s en entrée, la convertit en minuscules à l'aide de toLowerCase(), puis utilise la méthode replace avec une expression régulière pour remplacer toutes les limites de mots (b) par leurs équivalents majuscules. Cela met effectivement en majuscule la première lettre de chaque mot tout en mettant le reste en minuscule.

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!