The **`<dfn>` tag** is used as a definition element that specifies the title of a definition. The definition of the title specified by `<dfn>` tag must follow the announcing tag. 

# Attributes
The `<dfn>` tag supports #key# global attributes: attributes common to all HTML elements, e.g., class, id, lang, title, etc. #key# and #key# event attributes: attributes connected to action events, e.g., a user clicks a piece of text. #key#. 

# Content of tag
The content of the tag can modify the definition title. Some examples are:
- **Definition only** 
To italicize the definition's title only, use the `<dfn>` tag without any other tags. 
- **Add a title** 
The `<dfn>` tag can include a `title` property. The value of this title is the term being defined.
- **Abbreviated title** 
If the title is an abbreviation explained in the definition, you can use the `<abbr>` tag to show what the abbreviation stands for. Hovering the cursor over the title will show the un-abbreviated title.
- **Refer back to the title** 
The `<dfn>` tag can be used to specify a hyperlink within the text. The `<a>` tag is used to refer to the `<id>` specified in the content of `<dfn>` tag.

These modifications are also explained in the code below.

# Code 
The following code snippet shows the different ways the `<dfn>` tag can be used.

<html>
 <head>
 </head>
 <body>
 
 <dfn>CSS</dfn> is used to style HTML pages. (simple case) 

 
 <dfn title="Cascading Style Sheets"> CSS </dfn> is used to style HTML pages. (title added)

 
 <dfn><abbr title="Cascading Style Sheets">CSS</abbr></dfn> is used to style HTML pages. (abbreviation case)

 
 <dfn id="css-def">CSS</dfn> is used to style HTML pages. (linked text)
 This is some filler text...
 Learn <a href="#css-def">CSS</a> today!
 </body>
</html>

codemirror

What is the <dfn> element in HTML?

The `<dfn>` tag in HTML defines a term and supports global and event attributes, modifying the title's appearance.