How to mark abbreviations and make them understandable in HTML ? (original) (raw)

Last Updated : 23 Jul, 2025

In this article, we will learn how to specify a shorter version of the content in HTML. The tag (Abbreviation) is used to define the abbreviation or short form of an element. The and tags are used as shortened versions and used to represent a series of letters. For instance, "HTML" is used as an abbreviation for "HyperText Markup Language".

Syntax:

Abbreviated form

Attribute: This tag accepts an optional attribute as described below:

title:Itis used to specify extra information about the element. When the mouse moves over the element then it shows the information.

Example: This example illustrates the use of the tag in HTML.

HTML `

abbr tag

Welcome to GFG

Output:

Using tag simply won't show the expansion of the abbreviation even if the mouse has hovered over it. This makes it difficult for the user to understand the abbreviated form.

There are two ways using which we can make abbreviation understandable:

using with title attribute
using with

We will understand both ways through the examples.

with title attribute:

In order to remove this problem, the tag is used in combination with the title attribute which provides an expansion for the abbreviation. This text is provided by the browser as a tooltip when the mouse pointer has hovered over the element.

Syntax:

abbreviated form

Example: In this example, we have used the title attribute inside the tag that specify extra information about the element.

HTML `

abbr tag

GeeksforGeeks

<p>
    <abbr title="GeekforGeeks">GFG</abbr>:
    A Computer Science portal for geeks.
</p>

Output:

with: < abbr>can be used with to add definition for an abbreviation.

Syntax:

Abbreviated form

Example: This example illustrates the use tag with tag in HTML.

HTML `

abbr with dfn

GFG : Learn Data Structures Online At Your Own Pace With The Best Of Faculty In The Industry.

Output:

These are the methods that we can use to mark the abbreviations and make them understandable for the user.