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.
Spécification officielle
Ces informations sont extraites de la spécification officielle (W3C)