Semantics

An element that represents a scalar measurement within a known range, or a fractional value.

Additional info from the ARIA specification

See related progressbar.

Authors MAY set aria-valuemin and aria-valuemax to indicate the minimum and maximum values for the meter. Otherwise, their implicit values follow the same rules as <input type="range"> in HTML:

The value of aria-valuenow MUST NOT fall below or exceed the computed values of aria-valuemin and aria-valuemax, respectively.

Authors SHOULD NOT use the meter role to indicate progress; the progressbar role exists to address that need.

Abstract Role

  • WidgetRepresents a focusable, interactive element.

Content Categories

  • Phrasing ContentAn element that typically appears inline and provides semantic meaning to text content.

Allowed Descendants

Phrasing Children Allowed

No meter element descendants allowed.

Note

Children Become Presentational

Browsers automatically apply the presentation role to all descendant elements, so their semantics are not conveyed to assistive technologies.

Usage

Allowed HTML elements

Implicit semantics

These elements have the role semantics by default, without needing to set the role attribute. Reach for elements with native semantics first when choosing how to implement a role in your content.

  • meter

Explicitly allowed

  • img[role=meter]

Elements that can have any role

  • abbr[role=meter]
  • address[role=meter]
  • b[role=meter]
  • blockquote[role=meter]
  • canvas[role=meter]
  • cite[role=meter]
  • code[role=meter]
  • custom-element[role=meter]
  • data[role=meter]
  • del[role=meter]
  • dfn[role=meter]
  • div[role=meter]
  • em[role=meter]
  • figure[role=meter]
  • i[role=meter]
  • ins[role=meter]
  • kbd[role=meter]
  • mark[role=meter]
  • output[role=meter]
  • p[role=meter]
  • pre[role=meter]
  • q[role=meter]
  • samp[role=meter]
  • small[role=meter]
  • span[role=meter]
  • table[role=meter]
  • tbody[role=meter]
  • tfoot[role=meter]
  • thead[role=meter]
  • time[role=meter]
  • u[role=meter]
  • var[role=meter]