Cyber Week

Save big!

All courses under $5 - for a limited time!

Code has been added to clipboard!

HTML abbr Tag

Reading time 1 min
Published Jun 29, 2017
Updated Oct 2, 2019

HTML abbr: Main Tips

  • HTML <abbr> element marks a combination of characters as an abbreviation or an acronym.
  • With title attribute in the opening HTML <abbr> tag, you provide full-text explanation for the specified abbreviation (or acronym).
  • This element is a modern version of the deprecated <acronym>.

Use of abbr

HTML <abbr> marks abbreviations or acronyms and sets a full-text explanation for them.

Example
<p><abbr title="Hypertext Markup Language">HTML</abbr> is a presentation language.</p>

The explanation in the title attribute is not visible immediately. Users have to hover over the sequence of characters to trigger the comment.

Defining HTML Abbreviations

When the abbreviation (or acronym) is little-known, simply deciphering it might not be enough: you might need to provide some extra explanation. To do that, nest your <abbr> tags inside a <dfn> element:

Example
<p><dfn id="evm"><abbr title="Ethereum Virtual Machine">EVM</abbr>
</dfn> is a blockchain-based software platform. </p>

Let's analyze the example above bit by bit:

  • The <abbr> tags note that EVM is an HTML abbreviation.
  • The <dfn> tags show that EVM is a term being defined.
  • The title attribute defines the full term EVM represents.

Browser support

Browser image
Chrome
2+
Browser image
Edge
All
Browser image
Firefox
1+
Browser image
IE
7+
Browser image
Opera
All
Browser image
Safari
All

Mobile browser support

Browser image
Chrome
All
Browser image
Firefox
4+
Browser image
Opera
All
Browser image
Safari
All