The elements of HTML

path: sections/semantics-root.include

path: sections/semantics-document-metadata.include

path: sections/semantics-sections.include

path: sections/semantics-grouping-content.include

path: sections/semantics-textlevel.include

path: sections/semantics-edits.include

path: sections/semantics-embedded-content.include

path: sections/semantics-links.include

path: sections/semantics-tabular-data.include

path: sections/semantics-forms.include

path: sections/semantics-interactive-elements.include

path: sections/semantics-scriptings.include

path: sections/semantics-common-idioms.include

Disabled elements

An element is said to be actually disabled if it falls into one of the following categories:

This definition is used to determine what elements can be focused and which elements match the '':disabled'' pseudo-class.

Matching HTML elements using selectors

Case-sensitivity

The Selectors specification leaves the case-sensitivity of element names, attribute names, and attribute values to be defined by the host language. [[!SELECTORS4]]

Selectors defines that ID and class selectors, when matched against elements in documents that are in quirks mode, will be matched in an ASCII case-insensitive manner.

When comparing a CSS element type selector to the names of HTML elements in HTML documents, the CSS element type selector must first be converted to ASCII lowercase. The same selector when compared to other elements must be compared according to its original case. In both cases, the comparison is case-sensitive. When comparing the name part of a CSS attribute selector to the names of namespace-less attributes on HTML elements in HTML documents, the name part of the CSS attribute selector must first be converted to ASCII lowercase. The same selector when compared to other attributes must be compared according to its original case. In both cases, the comparison is case-sensitive. Attribute selectors on an HTML element in an HTML document must treat the values of attributes with the following names as ASCII case-insensitive, with one exception as noted in [[#rendering]]: All other attribute values and everything else must be treated as entirely case-sensitive for the purposes of selector matching. This includes:

Pseudo-classes

There are a number of dynamic selectors that can be used with HTML. This section defines when these selectors match HTML elements. [[!SELECTORS4]] [[!CSSUI]] : '':link'' : '':visited'' :: All <{a}> elements that have an <{links/href}> attribute, all <{area}> elements that have an <{links/href}> attribute, and all <{link}> elements that have an <{link/href}> attribute, must match one of '':link'' and '':visited''. Other specifications might apply more specific rules regarding how these elements are to match these pseudo-classes, to mitigate some privacy concerns that apply with straightforward implementations of this requirement. : '':active'' :: The '':active'' pseudo-class is defined to match an element while an element is being activated by the user. To determine whether a particular element is being activated for the purposes of defining the '':active'' pseudo-class only, an HTML user agent must use the first relevant entry in the following list. : If the element has a descendant that is currently matching the '':active'' pseudo-class :: The element is being activated. : If the element is the labeled control of a <{label}> element that is currently matching '':active'' :: The element is being activated. : If the element is a <{button}> element : If the element is an <{input}> element whose type attribute is in the <{input/Submit|Submit Button}>, <{input/Image|Image Button}>, <{input/Reset|Reset Button}>, or <{input/Button}> state :: The element is being activated if it is in a formal activation state and it is not disabled.

For example, if the user is using a keyboard to push a <{button}> element by pressing the space bar, the element would match this pseudo-class in between the time that the element received the keydown event and the time the element received the keyup event.

: If the element is an <{a}> element that has an <{links/href}> attribute : If the element is an <{area}> element that has an <{links/href}> attribute : If the element is a <{link}> element that has an <{link/href}> attribute : If the element has its tabindex focus flag set :: The element is being activated if it is in a formal activation state. : If the element is being actively pointed at :: The element is being activated. An element is said to be in a formal activation state between the time the user begins to indicate an intent to trigger the element's activation behavior and either the time the user stops indicating an intent to trigger the element's activation behavior, or the time the element's activation behavior has finished running, which ever comes first. An element is said to be being actively pointed at while the user indicates the element using a pointing device while that pointing device is in the "down" state (e.g., for a mouse, between the time the mouse button is pressed and the time it is depressed; for a remote control on a television, the time during which the remote control is pointing at the element). : '':hover'' :: The '':hover'' pseudo-class is defined to match an element while the user designates an element with a pointing device. For the purposes of defining the '':hover'' pseudo-class only, an HTML user agent must consider an element as being one that the user designates if it is: * An element that the user indicates using a pointing device. * An element that has a descendant that the user indicates using a pointing device. * An element that is the labeled control of a <{label}> element that is currently matching '':hover''.
Consider in particular a fragment such as: <p> <label for="c"> <input id="a"> </label> <span id="b"> <input id="c"> </span> </p> If the user designates the element with ID "a" with their pointing device, then the <{p}> element (and all its ancestors not shown in the snippet above), the <{label}> element, the element with ID "a", and the element with ID "c" will match the '':hover'' pseudo-class. The element with ID "a" matches it from condition 1, the <{label}> and <{p}> elements match it because of condition 2 (one of their descendants is designated), and the element with ID "c" matches it through condition 3 (its <{label}> element matches '':hover''). However, the element with ID "b" does not match '':hover'': its descendant is not designated, even though it matches '':hover''.
: '':focus'' :: For the purposes of the CSS '':focus'' pseudo-class, an element has the focus when its top-level browsing context has the system focus, it is not itself a browsing context container, and it is one of the elements listed in the focus chain of the currently focused area of the top-level browsing context. : '':enabled'' :: The '':enabled'' pseudo-class must match any element that is one of the following: * a <{button}> element that is not disabled * an <{input}> element that is not disabled * a <{select}> element that is not disabled * a <{textarea}> element that is not disabled * an <{optgroup}> element that does not have a <{optgroup/disabled}> attribute * an <{option}> element that is not disabled * a <{fieldset}> element that is not a disabled fieldset : '':disabled'' :: The '':disabled'' pseudo-class must match any element that is actually disabled. : '':checked'' :: The '':checked'' pseudo-class must match any element falling into one of the following categories: * <{input}> elements whose <{input/type}> attribute is in the <{input/Checkbox}> state and whose checkedness state is true * <{input}> elements whose <{input/type}> attribute is in the <{input/Radio|Radio Button}> state and whose checkedness state is true * <{option}> elements whose selectedness is true : '':indeterminate'' :: The '':indeterminate'' pseudo-class must match any element falling into one of the following categories: * <{input}> elements whose <{input/type}> attribute is in the <{input/Checkbox}> state and whose {{HTMLInputElement/indeterminate}} IDL attribute is set to true * <{input}> elements whose <{input/type}> attribute is in the <{input/Radio|Radio Button}> state and whose radio button group contains no <{input}> elements whose checkedness state is true. * <{progress}> elements with no <{progress/value}> content attribute : '':default'' :: The '':default'' pseudo-class must match any element falling into one of the following categories: * <{button}> elements that are their form's default button * <{input}> elements whose <{input/type}> attribute is in the <{input/Submit|Submit Button}> or <{input/Image|Image Button}> state, and that are their form's default button * <{input}> elements to which the <{input/checked}> attribute applies and that have a <{input/checked}> attribute * <{option}> elements that have a <{option/selected}> attribute : '':valid'' :: The '':valid'' pseudo-class must match any element falling into one of the following categories: * elements that are candidates for constraint validation and that satisfy their constraints * <{form}> elements that are not the form owner of any elements that themselves are candidates for constraint validation but do not satisfy their constraints * <{fieldset}> elements that have no descendant elements that themselves are candidates for constraint validation but do not satisfy their constraints : '':invalid'' :: The '':invalid'' pseudo-class must match any element falling into one of the following categories: * elements that are candidates for constraint validation but that do not satisfy their constraints * <{form}> elements that are the form owner of one or more elements that themselves are candidates for constraint validation but do not satisfy their constraints * <{fieldset}> elements that have of one or more descendant elements that themselves are candidates for constraint validation but do not satisfy their constraints : '':in-range'' :: The '':in-range'' pseudo-class must match all elements that are candidates for constraint validation, have range limitations, and that are neither suffering from an underflow nor suffering from an overflow. : '':out-of-range'' :: The '':out-of-range'' pseudo-class must match all elements that are candidates for constraint validation, have range limitations, and that are either suffering from an underflow or suffering from an overflow. : '':required'' :: The '':required'' pseudo-class must match any element falling into one of the following categories: * <{input}> elements that are required * <{select}> elements that have a <{select/required}> attribute * <{textarea}> elements that have a <{textarea/required}> attribute : '':optional'' :: The '':optional'' pseudo-class must match any element falling into one of the following categories: * <{input}> elements to which the <{input/required}> attribute applies that are not required * <{select}> elements that do not have a <{select/required}> attribute * <{textarea}> elements that do not have a <{textarea/required}> attribute : '':read-only'' : '':read-write'' :: The '':read-write'' pseudo-class must match any element falling into one of the following categories, which for the purposes of Selectors are thus considered user-alterable: [[!SELECTORS4]] * <{input}> elements to which the <{input/readonly}> attribute applies, and that are mutable (i.e., that do not have the <{input/readonly}> attribute specified and that are not disabled) * <{textarea}> elements that do not have a <{textarea/readonly}> attribute, and that are not disabled * elements that are editing hosts or editable and are neither <{input}> elements nor <{textarea}> elements The '':read-only'' pseudo-class must match all other HTML elements. : '':defined'' :: The '':defined'' pseudo-class must match any element whose custom element state is either uncustomized or custom, decribed in [[DOM41]] as defined. : '':dir(ltr)'' :: The '':dir(ltr)'' pseudo-class must match all elements whose directionality is 'ltr'. : '':dir(rtl)'' :: The '':dir(rtl)'' pseudo-class must match all elements whose directionality is 'rtl'.

Another section of this specification defines the target element used with the '':target'' pseudo-class.

This specification does not define when an element matches the '':lang()'' dynamic pseudo-class, as it is defined in sufficient detail in a language-agnostic fashion in the Selectors specification. [[!SELECTORS4]]