Centrer un texte en HTML : comment s’y prendre sans la balise ?
La balise (tag) <center> pour centrer le texte en HTML a été supprimée avec HTML5. On utilise maintenant le CSS : comme le paramètre requis text-align est déjà défini dans la balise <style>, le code devient plus clair et les erreurs peuvent être évitées !
Centrer du texte en HTML : comment faire ?
Pour le HTML Centering, c’est-à-dire le centrage de textes dans un document HTML, on utilise aujourd’hui la commande CSS text-align. Cette instruction permet de formater le texte horizontalement. Pendant longtemps, la balise HTML <center>, désormais obsolète, a été utilisée à cet effet. Cette méthode n’est cependant plus supportée depuis HTML5**.
- 3x plus rapide, 60 % d'économie
- Haute disponibilité >99,99 %
- Seulement chez IONOS : jusqu'à 500 Go inclus
Centrer un texte avec text-align en CSS
Depuis HTML5, vous enregistrez l’instruction de centrer un texte en HTML dans la balise <style>. Nous pouvons illustrer ce processus le plus simplement possible à l’aide d’un petit exemple. Dans le code suivant, nous centrons le titre, le texte et un conteneur HTML <div> dans notre document HTML :
<!DOCTYPE html>
<html>
<head>
<style>
h1 {text-align: center;}
p {text-align: center;}
div {text-align: center;}
</style>
</head>
<body>
<h1>Voici votre titre</h1>
<p>Ici, il y a de la place pour votre contenu.</p>
<div>Il y a une div à cet endroit.</div>
</body>
</html>La structure du document est donc déjà définie en amont. Cela permet de garder le code clair et d’éviter les erreurs.
- 1 certificat SSL Wildcard par contrat
- Fonction incluse Domain Connect pour une configuration DNS simplifiée
HTML <center> : tag obsolète depuis HTML5
Dans les anciennes versions du langage de programmation Web, on utilisait la balise HTML <center>, que nous souhaitons également vous montrer dans cet article. Comme elle est obsolète et n’est plus supportée, vous devriez toutefois impérativement recourir à la solution CSS. La syntaxe de <center> pour le texte HTML était la suivante :
<center><p>Texte</p></center>Dans l’exemple ci-dessous, vous pouvez voir comment la balise HTML <center> était utilisée exactement dans la pratique. Contrairement à la solution moderne, il fallait modifier le code directement dans le corps du texte pour le centrer. Selon le volume et la structure, cela conduisait à un code peu clair et était, en comparaison, nettement plus sujet aux erreurs :
<!DOCTYPE html>
<html>
<body>
<p>Ici se trouve un texte qui n’a pas été centré.</p>
<center><p>Ici se trouve un texte qui a été centré.</p></center>
</body>
</html>Le résultat se présente alors comme suit :
Vous trouverez tout ce qu’il faut savoir sur l’Hypertext Markup Language (HTML) dans notre Digital Guide. Nous vous y expliquons également comment faire vos premiers pas avec HTML. De même, si vous vous demandez comment intégrer du CSS dans une page HTML, nous vous proposons le tutoriel idéal avec de nombreux exemples pratiques !