HTML Element: abbr

Example

Syntax

1

<p>The <abbr title="World Health Organization">WHO</abbr> is a specialized agency of the United Nations.</p>

Result

Notice the browser’s default styling for the abbr element; a dotted underline. Hover over the abbreviated text and you’ll be shown a tooltip with the contents from the title attribute:

Content

While the primary purpose of the <abbr> element is to mark up abbreviations and acronyms, the HTML specification does not restrict its use to these types of content.

Using the <abbr> element to mark up other types of short-form content, such as dates, measurements, or units, is possible. However, it is recommended to use the <abbr> element for its intended purpose to ensure semantic and accessible markup.

Did You Know?

• The <abbr> element was introduced in HTML 4.0 in 1998.
• The <abbr> element includes abbreviations and acronyms. It can also be used to mark up other types of short-form content, such as dates, measurements, and units.
• Screen readers and other assistive technologies can use the title attribute of the <abbr> element to announce the full form of the abbreviation or acronym to visually impaired users.
• The <abbr> element can be styled using CSS to display the abbreviation or acronym in a specific way, such as changing the color or adding a border.

Learn More

• Official W3C specification <abbr>

• 

  HTML & CSS for Beginners (MEGA Free Course!)

  

  Adi Purdila

  08 Sep 2022