Global attributes are attributes that can be used on any HTML element. These are shared across all tags.
What are Global Attributes?
Global attributes are HTML attributes that can be applied to any HTML element, regardless of the element type. For example, you can add an id, class, or style attribute to a <div>, <p>, <a>, or any other element.
These attributes provide common functionality such as unique identification, styling, accessibility, interactivity, and internationalization.
Core
Attribute
Description
id
A unique identifier for the element. Used for CSS styling, JavaScript targeting, and anchor links.
class
Specifies one or more CSS class names for styling the element.
style
Applies inline CSS styles directly to the element.
title
Provides advisory text, often displayed as a tooltip on hover.
hidden
Indicates the element is not yet, or is no longer, relevant. The browser won't render such elements.
lang
Specifies the language of the element's content using a BCP 47 language tag (e.g. "en", "fr", "ja").
dir
Specifies the text direction. Values: ltr (left-to-right), rtl (right-to-left), auto.
data-*
Custom data attributes that store extra information on the element. Accessible via JavaScript using element.dataset.
Interaction
Attribute
Description
tabindex
Specifies the tab order for keyboard navigation. Use -1 for focusable but not tab-reachable, 0 for natural order.
accesskey
Specifies a keyboard shortcut to activate or focus the element. The value is a space-separated list of characters.
contenteditable
Makes the element's content editable by the user. Values: true, false, plaintext-only.
draggable
Specifies whether the element can be dragged using the Drag and Drop API. Values: true, false.
autofocus
Automatically focuses the element when the page loads. Only one element per page should have this attribute.
inert
A boolean attribute that makes the browser disregard user input events for the element and its descendants.
popover
Designates an element as a popover element, hidden until opened via a control element or JavaScript.
Text & Input
Attribute
Description
spellcheck
Specifies whether the element should be checked for spelling errors. Values: true, false.
autocapitalize
Controls whether inputted text is automatically capitalized and in what manner.
autocorrect
Controls whether input text is automatically corrected for spelling errors.
translate
Specifies whether the content should be translated when the page is localized. Values: yes, no.
enterkeyhint
Hints what action label the enter key should display on virtual keyboards. Values: enter, done, go, next, previous, search, send.
inputmode
Hints the type of virtual keyboard to display. Values: none, text, decimal, numeric, tel, search, email, url.
writingsuggestions
Controls whether browser-provided writing suggestions should be enabled. Values: true, false.