Niveau : Débutant

Attributs globaux hidden, contenteditable, contextmenu, spellcheck

Les attributs modulent le comportement des éléments. Il existe de nouveaux attributs HTML5 globaux, qui peuvent s'appliquer à la majorité des balises en se révélant bien pratiques. Voici un tour d'horizon des plus aisés à mettre en place.

Tutoriel par (Art Director & Creative Designer, Paris)
Créé le (24362 lectures)
Tags : attributs, spellcheck, contextmenu, contenteditable, hidden

Sommaire


Attributs globaux en HTML5

Les attributs globaux sont des attributs destinés à être utilisables pour tous les éléments du langage. Pour HTML4 et XHTML 1.x, on disposait notamment déjà de :

Nom Détails
id Attribue un identifiant unique
class Attribue une classe
lang Définit la langue du contenu
accesskey Combinaison de touches d'accès direct
dir Donne la direction du texte (ltr ou rtl)
style Embarque des styles CSS spécifiques appliqués à l'élément
tabindex Définit un ordre de tabulation
title Donne un intitulé à l'élément, souvent affiché en infobulle

Avec HTML5 de nouveaux attributs ont vu le jour. Certains sont spécifiques (par exemple charset sur <meta>, async sur <script>, manifest sur <body> pour les applications hors-ligne, list sur <input>, etc) et d'autres apportent un grand confort d'intégration en étant applicables à la globalité.

Nom Détails
data-* Stockage d'informations dans des attributs neutres préfixés par data-
aria-* et role Propriétés et rôles ARIA pour améliorer l'accessibilité
draggable Déplacement dans le cadre du Drag & Drop
dropzone Zone de dépôt dans le cadre du Drag & Drop
hidden Indique la pertinence d'accès (et d'affichage) à un élément
contenteditable Indique si le contenu est éditable dans le navigateur ou non
contextmenu Spécifie un menu contextuel, lié à un élément donné
spellcheck Spécifie si l'élément peut être concerné par la vérification orthographique ou non

Les 4 premiers ne sont pas abordés dans ce document car ils font l'objet d'applications très spécifiques décrites par ailleurs.