Balise HTML pre – L’élément de formatage du texte

Définition

L’élément HTML pre permet de conserver le formatage effectué sur des texte avant l’affichage dans le navigateur, c’est-à-dire lors de la création du code dans l’éditeur de texte.

Cet élément est généralement utilisé pour afficher du texte possédant un formatage particulier ou pour afficher tout simplement des exemples de code. On peut notamment l’utiliser pour améliorer le rendu d’un tableau de données récupérées en PHP dans une base MySQL.

Si cet élément s’avère parfois pratique, attention à ne pas l’utiliser de manière abusive en remplacement du CSS car cela est une mauvaise pratique. On se souviendra qu’il convient de toujours utiliser, dans la mesure du possible, le CSS plutôt que le HTML pour la mise en forme.

En termes d’accessibilité, on fournira toujours une description alternative dans le cas où on utilise un élément pre pour créer des « dessins » (comme ceci par exemple :

(o_O)

) à partir d’éléments de texte.

 

Attributs

L’élément pre ne possède pas d’attribut particulier. Il supporte les attributs universels comme l’ensemble des éléments HTML.

Pour rappel, les attributs universels sont des attributs qui peuvent être ajoutés à tous les éléments HTML. Quelques exemples d’attributs universels communs : class, id, lang, style, title

 

Exemples d’utilisation

See the Pen
Balise HTML pre
by Pierre (@pierregiraud)
on CodePen.

 

Compatibilité navigateurs

Ces informations sont tirées du site caniuse.com. Les cases vertes indiquent que le navigateur supporte l’élément. Les cases grises indiquent que le support est inconnu. Les cases rouges indiquent que l’élément n’est pas supporté. Le chiffre dans chaque case correspond à la version du navigateur concernée.

Element HTML pre support navigateur

 

Spécification officielle

Ces informations sont extraites de la spécification officielle (W3C)

Element HTML pre reference documentation officielle

Laisser un commentaire

© Pierre Giraud - Toute reproduction interdite