Publishers of technology books, eBooks, and videos for creative people

Home > Articles > Web Design & Development > HTML/XHTML

  • Print
  • + Share This
This chapter is from the book

Defining a Term

The dfn element marks the one place in your document that you define a term. Subsequent uses of the term are not marked. You wrap dfn only around the term you’re defining, not around the definition red_circle-a.jpg.

red_circle-a.jpg Note that although pleonasm appears twice in the example, dfn marks the second one only, because that’s when I defined the term (that is, it’s the defining instance). Similarly, if I were to use pleonasm subsequently in the document, I wouldn’t wrap it in dfn because I’ve already defined it. By default, browsers style dfn text differently than normal text red_circle-b.jpg. Also, you don’t have to use the cite element each time you use dfn, just when you reference a source.

...

<body>



<p>The contestant was asked to spell "pleonasm." 
She requested the definition and was told that 
<dfn>pleonasm</dfn> means "a redundant word or expression" 
(Ref: <cite><a href=" http://dictionary.reference.com/browse/pleonasm" rel="external">dictionary.com</a></cite>).</p>



</body>
</html>
04_14.jpg

red_circle-b.jpg The dfn element renders in italics by default in some browsers (Firefox, in this case), just like cite, but not in Webkit-based browsers such as Safari and Chrome. You can make them consistent by adding dfn { font-style: italic; } to your style sheet (see Chapters 8 and 10).

It’s important where you place the dfn in relation to its definition. HTML5 states, “The paragraph, description list group, or section that is the nearest ancestor of the dfn element must also contain the definition(s) for the term given by the dfn element.” This means that the dfn and its definition should be in proximity to each other. This is the case in both gray_circle-a.jpg and the example given in the third tip; the dfn and its definition are in the same paragraph.

To mark the defining instance of a term

  1. Type <dfn>.
  2. Type the term you wish to define.
  3. Type </dfn>.
  • + Share This
  • 🔖 Save To Your Account