Aller au contenu

Attributs globaux HTML

Les attributs globaux peuvent être utilisés sur n’importe quel élément HTML. Cependant, certains attributs n’ont aucun effet sur certains éléments. Par exemple, spellcheck n’affectera pas le comportement ni la sémantique d’un paragraphe, et lang n’aura aucun effet sur un élément sans contenu.

Vous trouverez ci-dessous tous les attributs globaux et leurs explications :

AttributesDescriptionValueSyntax
accesskeyGénère un raccourci clavier pour l’élément. La manière d’accéder à la touche de raccourci varie selon le navigateur (par ex. ALT, CTRL, ALT+SHIFT ou CTRL+ALT).character<element accesskey="character">
classAjoute un ou plusieurs noms de classe à un élément. Lorsqu’il est utilisé avec des feuilles de style, il indique au navigateur quelles classes doivent appliquer des propriétés à l’élément.classname<element class="classname">
contenteditableSpécifie si le contenu d’un élément est modifiable. Avec la valeur "true", le contenu sera modifiable ; avec la valeur "false" (par défaut), il ne le sera pas.true false<element contenteditable="true
contextmenuObsolète. Était utilisé pour créer un menu contextuel pour l’élément, affiché lorsque l’utilisateur clique avec le bouton droit. Supprimé de la norme HTML Living Standard.menu_id<element contextmenu="menu_id">
data-*Permet d’intégrer des attributs de données personnalisées sur tous les éléments HTML. Ces attributs sont accessibles via l’API JavaScript dataset.value<element data-attribute="value">
dirDéfinit la direction du texte pour le contenu à l’intérieur de l’élément. Utile pour insérer du contenu avec une direction de texte différente, comme l’arabe ou l’hébreu.rtl ltr auto<element dir="ltr
draggableDéfinit si un élément est déplaçable par glisser-déposer. Lorsque la valeur est "true", le navigateur autorise le glissement ; lorsque la valeur est "false", le glissement est désactivé.true false auto<element draggable="true
dropzoneSpécifie si les données glissées sont copiées, déplacées ou liées après le dépôt. Si l’attribut est omis, "copy" est implicite par défaut.copy move link<element dropzone="copy
hiddenLorsqu’il est présent, il indique qu’un élément n’est pas encore pertinent ou ne l’est plus. Les navigateurs masqueront l’élément.-<element hidden>
idDéfinit un identifiant unique pour l’élément. Les identifiants doivent comporter au moins un caractère et ne doivent pas contenir d’espace.id<element id="id">
langDéfinit la langue du contenu de l’élément. Voir tous les codes de langue ici.language_code<element lang="language_code">
spellcheckDéfinit si un élément peut être vérifié pour les fautes d’orthographe. Lorsque la valeur est "true" ou une chaîne vide (""), les navigateurs soulignent généralement les mots mal orthographiés et proposent des alternatives. Lorsque la valeur est "false", les vérifications orthographiques sont désactivées.true false<element spellcheck="true
styleDéfinit des styles CSS en ligne pour un élément. Contrairement à l’attribut class, cela applique les styles directement à l’élément.style_definitions<element style="style_definitions">
tabindexDéfinit l’ordre de tabulation d’un élément lors de la navigation avec la touche "Tab". Si la valeur est négative, l’élément est exclu de la navigation séquentielle au clavier.number<element tabindex="number">
titleFournit des informations supplémentaires sur l’élément. Les navigateurs l’affichent généralement sous forme d’infobulle.text<element title="text">
translateDéfinit si le contenu d’un élément doit être traduit. Lorsque la valeur est "yes" ou une chaîne vide (""), les navigateurs traduiront le texte. Lorsque la valeur est "no", l’élément est exclu de la traduction.yes no<element translate="yes

Practice

Which of the following is a true statement about HTML Global attributes according to https://www.w3docs.com/learn-html/global-attributes.html?

Trouvez-vous cela utile?

Aperçu dual-run — comparez avec les routes Symfony en production.