HTML Abbr Tag

The <abbr> tag in HTML is used to show the abbreviation or acronym of a word or phrase. It's a way to help readers understand the full meaning of a shortened word when they hover their mouse over it. So, with the help of the <abbr> tag, you can make your content clearer and more informative without always writing the full form of every term.

For example, instead of writing World Health Organization every time, you can write WHO using the <abbr> tag. When users hover over WHO, they will see a small box showing the full meaning.

Syntax -

The syntax of the <abbr> tag is very simple. You just need to wrap the abbreviation inside the <abbr> tag and provide the full meaning inside the title attribute.

<abbr title=full-form>
short-form
</abbr>
  • The title attribute holds the full form.
  • The text between <abbr> and </abbr> is the abbreviation shown on the webpage.
  • When users hover their mouse, the browser shows the full meaning.
Example -

Scenario - 

<!DOCTYPE html>
<html>
	<head>
		<title>abbreviation example</title>
	</head>
	<body>
		<p><abbr title="">TC</abbr> 
		is a best online tutorials library.</p> 
	</body>
</html>
Output -
TC is a best online tutorials library.
Explaining Example -

On the webpage, you will see the sentence with TC. When you move your mouse over TC, a small box will pop up saying TutorialsCampus.