HTML <abbr> tag

What is the function of <abbr> tag?

The <abbr> tag expounds the full text explanation of any things. In some browsers, the content of the <abbr> element is rendered with dotted underscore. To define <abbr> tag, we use title attribute with some value which is to be seen as a pop-up texts when hover the mouse over the abbreviation. The <abbr> tag and title attribute are always associated each other to define the abbreviation or acronym of an object.
Type: Inline Element

Example of <abbr> tag

<abbr title = "Hyper Text Markup Language"> HTML </abbr>

Here, if you hover over the "HTML", a small box will be appeared near HTML showing the abbreviation what we have written (here, Hyper Text Markup Language).
It might not support on mobile browsers like UC Browser, Opera Mini etc.

Supported Browsers

Tag Chrome browser Internet explorer browser Firefox browser Safari browser Opera browser
<abbr> Yes Yes Yes Yes Yes

Full Code Examples

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p> <abbr title = "Hyper Text Markup Language"> HTML </abbr> is the world most common Internet language. </p>
</body>
</html>

Output

HTML is the world most common Internet language.

More Reference

The users on the website could not realize the value of the title attribute until they hover over the text. But giving the <abbr> tag improves the website crawling on search engine like Google.
The <abbr> tag and title attribute are dependent of each other. They are always combined to define an abbreviation.
There is an HTML tag called <acronym> which performs the same function as <abbr> has done. But it is highly advised to use <abbr> tag since <acronym> is not supported or readable in HTML5.
Note that <acronym> tag is not longer valid in HTML5.