Comment mettre un texte HTML en majuscule ou minuscule ?

Réponses rédigées par Antoine
Dernière mise à jour : 2019-07-13 14:05:17
Thèmes : webmaster - html - css - javascript
Question

Comment faire pour mettre un texte en majuscule ou minuscule en HTML ?

Réponse

Pour mettre un texte HTML en majuscule ou minuscule, vous devez utiliser la propriété CSS text-transform ; elle est utilisée pour convertir du texte HTML en lettres majuscules ou minuscules.

<div style="text-transform: uppercase;">un texte en majuscule</div>

<div style="text-transform: lowercase;">un texte en minuscule</div>

Vous trouverez d'avantage d'informations sur la propriété CSS text-transform et sur la manière de gérer les majuscules, minuscules et le type de lettrage en HTML sur cette page du site de Mozilla.

Réponse

Vous pouvez aussi utiliser JavaScript pour mettre un texte HTML en majuscule ou en minuscule :

  • toLowerCase() met un texte en minuscule.
  • toUpperCase() met un texte en majuscule.

Voici un exemple pour mettre un texte en majuscule ou minuscule avec JavaScript :

<html>
<head>
<meta charset="utf-8">
</head>
<body>

<div id="maj">un texte en majuscule</div>

<div id="min">un texte en minuscule</div>

<script>
function Majuscule() {
	document.getElementById('maj').innerHTML = document.getElementById('maj').innerHTML.toUpperCase();
}

function Minuscule() {
	document.getElementById('min').innerHTML = document.getElementById('min').innerHTML.toLowerCase();
}

Majuscule();
Minuscule();
</script>  
</body>
</html>