HTML attribute


HTML attributes are special words used inside the opening tag to control the element's behaviour. HTML attributes are a modifier of an HTML element type. An attribute either modifies the default functionality of an element type or provides functionality to certain element types unable to function correctly without them. In HTML syntax, an attribute is added to an HTML start tag.
Several basic attributes types have been recognized, including: required attributes, needed by a particular element type for that element type to function correctly; optional attributes, used to modify the default functionality of an element type; standard attributes, supported by many element types; and event attributes, used to cause element types to specify scripts to be run under specific circumstances.
Some attribute types function differently when used to modify different element types. For example, the attribute name is used by several element types, but has slightly different functions in each.

Description

HTML attributes generally appear as name-value pairs, separated by =, and are written within the start tag of an element, after the element's name:
element content
Where element names the HTML element type, and attribute is the name of the attribute, set to the provided value. The value may be enclosed in single or double quotes, although values consisting of certain characters can be left unquoted in HTML. Leaving attribute values unquoted is considered unsafe.
Although most attributes are provided as paired names and values, some affect the element simply by their presence in the start tag of the element.
The abbreviation element, abbr, can be used to demonstrate these various attributes:
HTML
This example displays as HTML in blue without being a link, and in most browsers, pointing the cursor at the abbreviation should display the title text "Hypertext Markup Language" within a floating yellow background.
Centered text

In this other example, your text will look like this:
Centered text

Most elements also take the language-related attributes lang and dir.

Common attributes

Usually, HTML elements can take any of several most common standard attributes :
HTML attributes are generally classified as required attributes, optional attributes, standard attributes, and event attributes:

Used by one element

Standard attributes are also known as global attributes, and function with a large number of elements. They include the basic standard attributes: these include accesskey, class, contenteditable, contextmenu, data, dir, hidden, id, lang, style, tabindex, title. There are also some experimental ones. Both xml:lang and xml:base have been deprecated. The multiple aria-* attributes improve accessibility. The event handler attributes are listed later on.
Technically all standard attributes must be accepted by all elements, though they will not function with some elements. The table below lists some common standard attributes, and some elements they can function with.
Elementidclassstyletitledirlangxml:langaccesskeytabindex
id
dirlangxml:lang
dirlangxml:lang
dirlangxml:lang
dirlangxml:lang
titledirlangxml:lang
idclassstyletitle
idclassstyletitle
idclassstyletitle
idclassstyletitle
idclassstyletitle
idclassstyletitledirlang
idclassstyletitledirlang
idclassstyletitledirlang
idclassstyletitledirlang
idclassstyletitledirlang
idclassstyletitledirlang
idclassstyletitledirlang
idclassstyletitledirlang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
,,,,, idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:lang
idclassstyletitledirlangxml:langaccesskey
idclassstyletitledirlangxml:langaccesskey
idclassstyletitledirlangxml:langtabindex
idclassstyletitledirlangxml:langtabindex
idclassstyletitledirlangxml:langaccesskeytabindex
idclassstyletitledirlangxml:langaccesskeytabindex
idclassstyletitledirlangxml:langaccesskeytabindex
idclassstyletitledirlangxml:langaccesskeytabindex
idclassstyletitledirlangxml:langaccesskeytabindex

Event attributes

The standard attributes include the event handler attributes. They are all prefixed on-:
Event attributes, added in HTML version 4, allow an element to specify scripts to be run under specific circumstances. The table below lists some common event handler attributes, and some elements they can function with.
ElementAtAtAtAtAtAtAtAtAtAtAtAtAtAtAtAtAt
onloadonunload
onloadonunloadonclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
,,,,, onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onabortonclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyup
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyuponbluronfocus
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyuponbluronfocus
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyuponbluronfocus
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyuponbluronfocus
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyuponbluronfocus
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyuponbluronfocusonchange
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyuponbluronfocusonchangeonselect
onclickondblclickonmousedownonmousemoveonmouseoutonmouseoveronmouseuponkeydownonkeypressonkeyuponbluronfocusonchangeonselect