Code has been added to clipboard!

HTML dfn Tag

Reading time 2 min
Published Jul 19, 2017
Updated Oct 2, 2019

HTML dfn Tag: Main Tips

  • The dfn tag is used to indicate a defined term.
  • dfn stands for definition.
  • This tag supports global attributes.

Usage of HTML Definition Tag

The HTML dfn tag represents a term that needs and has an explanation. It is usually used when a specific term first occurs in a page.

Example
<p>
  <dfn>CSS</dfn> is the styling language for HTML.
</p>

The term definition can be provided by a <p> element, a pair of <dt> and <dd> elements, or a <section> which the <dfn> element is a child of.

Udacity
Pros
  • Simplistic design (no unnecessary information)
  • High-quality courses (even the free ones)
  • Variety of features
Main Features
  • Nanodegree programs
  • Suitable for enterprises
  • Paid certificates of completion
Coursera
Pros
  • Professional service
  • Flexible timetables
  • A variety of features to choose from
Main Features
  • Professional certificates of completion
  • University-level courses
  • Multiple Online degree programs
Datacamp
Pros
  • Great user experience
  • Offers quality content
  • Very transparent with their pricing
Main Features
  • Free certificates of completion
  • Focused on data science skills
  • Flexible learning timetable

Most Common Attributes

When using the HTML definition tag, you can also include a title attribute. Its value will then be considered to be the defined term, and shown when you hover your mouse over the <dfn> element:

Example
<p>
  <dfn title="Cascading Style Sheet">CSS</dfn> is the styling language for HTML.
</p>

Note: if your dfn HTML tag has no title attribute, all it will do is specify where the defined term is in the definition.

You can also add an id attribute to the <dfn> element. Then, whenever a term is used, you can refer back to the definition using the <a> tag. This is handy when you use the same term, and want to remind the reader what it means:

Example
<p><dfn id="css-def">CSS</dfn> is the styling language for HTML.</p>
<p>This is a paragraph</p>
<p>This is a paragraph</p>
<p>Learn <a href="#css-def">CSS</a> now.</p>

Browser support

Browser image
Chrome
All
Browser image
Edge
All
Browser image
Firefox
1+
Browser image
IE
All
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

Latest Udacity Coupon Found:

Verified STAFF PICK

75% OFF COURSES

Udacity Black Friday Offer

The best time to save on Udacity courses is now - follow this coupon to access a 75% Udacity Black Friday discount & enjoy learning at a very low cost!

Expiration date: 03/03/2021
3176 People Used
Only 97 Left
Rating
5.0