Global attributes

These are the global attributes defined in the HTML5 specification. They are the attributes which can be used on any element.

Note that the event handler attributes like onclick haven't been documented here yet, but we'll add them soon.

accesskey: One or more characters (usually each a letter or digit) which are suggested that the browser use as keyboard shortcuts for focusing the element. If there are more than one then they are alternative shortcuts for the same thing, and should be separated by spaces. The browser will likely use some combination of other keys with the ones suggested to make the full keystroke that needs to be activated, for example accesskey=X might enable a shortcut Ctrl+Alt+X.
autocapitalize: For tablet and phone devices, hints at whether they should use the normal default of starting with a capital-letter virtual keyboard for at the start of entering a new value. Set to none, sentences, words, or characters, depending on where you want capitals to be the default.
autofocus: Indicates that the browser should give focus to this control as soon as the page is loaded. Useful for pages such as a search engine's homepage, where typing into the control is almost always what the user will want to do.
class: One or more class names, separated by spaces. Usually used to identify different parts of a page that should have particular CSS styles applied, although it can be used for other things, such as microformats.
contenteditable: Can be used to make this element, and its descendants, editable in the browser. This can be used for making interactive web applications and WYSIWYG editing environments as an alternative to text areas. Actually using it effectively is fairly complicated, but there are free JavaScript libraries that can do most of the work. Valid values are true and false.
contextmenu: Obsolete, don't use it. Was for giving the ID of a <menu> element that should be used as a custom context menu when the user right-clicks on this element.
data-whatever: You can use any attribute whose name starts with data- to store arbitrary information for your own use. Useful for extra information that can't be expressed with semantic HTML but is needed by your JavaScript code.
dir: Tells a graphical browser whether the textual content of this element is in a language that should be rendered left to right (ltr) or right to left (rtl), or whether the browser should guess (auto).
draggable: Set this to true to enable custom drag-and-drop behaviour for this element, or false to disable the browser's built-in drag-and-drop handling for it.
dropzone: One or more words indicating what dragging an element will do, separated by spaces. Valid values are copy, move, and link, as well as anything that starts with string: or file:.
enterkeyhint: An indication of what will happen when the enter/return key is pressed. For example setting this to search might make a phone's virtual keyboard show a magnifying glass 🔍 icon for the enter button. See the specification for details.
hidden: If present, this element and its content should be hidden by the browser. Used if the content shouldn't initially be visible, because it will be displayed later by some JavaScript, or that the content is used by the JavaScript code in some other way.
id: An identifier (a name) used to uniquely identify a particular element. Should be different from any other IDs on other elements.
inputmode: A hint to browsers on devices like phones, where they are using a virtual keyboard, as to what kind of data will be entered. This might help the browser choose a more appropriate default type of keyboard, eg showing only numbers if the value is numeric.
is: The name of a custom element that this element is really supposed to be, one that extends this element. Allows you to get special behaviour for the element provided by JavaScript, while the element can still be interpreted with the basic meaning of the element you're using to represent it, eg by search engines that likely don't know anything about custom elements.
itemid: A URI which identifies a particular microdata item.
itemprop: Identifies what property or properties this part of a microdata item represents.
itemref: Creates references to one or more other microdata items, by listing their identifier URIs separated by spaces. Must only be used on an element that also has a itemscope attribute.
itemscope: Present on an element that should be considered the root of a new microdata item.
itemtype: One or more absolute URIs separated by spaces, which define what type or types of information this microdata item represents. Must only be used on an element that also has a itemscope attribute.
lang: Specifies the natural language the content is in. Usually just set on the <html> element to indicate the language the whole document is in, but can also be used to tell the browser (and search engines, screen readers, etc.) that a particular piece of content is in a different language.
nonce: A single-use random number used to control fetches by the content security policy specification.
onresize: Called when the document's window is resized.
spellcheck: Advises the browser that it should enable spellchecking (if it supports it) or disable it for a particular editable control, such as a <textarea> element. Set to true to enable, or false to disable (for example to turn off spell-checking for text that's meant to be a computer program, or something else where spell-checking wouldn't make sense). By default the browser can make it's own decision about what should be spell-checked.
style: Contains CSS styling rules to apply to this element. It's best to avoid this if possible, keeping all the CSS separate and using IDs, classes, or other selectors to determine which styles are applied. Mostly useful for adding temporary ad-hoc styling, such as for debugging problems with the layout of a page.
tabindex: Indicates that this element should be focusable, even if it normally wouldn't be, and sets its position in the cycle of elements to which focus will go when the user moves through the page usually with the Tab key.
title: A descriptive piece of text which provides advisory information about the element or its contents. Usually displayed by graphical browsers as a tooltip. Can be split into multiple lines by putting line breaks in the attribute's value. Some elements give it a special meaning.
translate: Indicates whether the content of this element should be translated into another language when the rest of the document is translated. By default, all content should be assumed to be translatable. The element can be set to no or yes to override that, and the value is inherited unless overridden again.