dfn要素

dfn要素は、dfn要素で括った内容が定義用語であると示す要素。

カテゴリー フロー・コンテンツ、フレージング・コンテンツ、パルパブル・コンテンツ。
コンテキスト フレージング・コンテンツを内包できる要素内で使用できる。
コンテンツ・モデル フレージング・コンテンツを内包できる。
ただし、dfn要素を子孫要素に持つことはできない。
属性 グローバル属性。
dfn要素におけるtitle属性は、特別な意味を持つ。
ブラウザ対応

構文

<dfn>定義用語</dfn>

要点

  • dfn要素は、dfn要素で括った内容が定義用語であると示す要素である。
  • dfn要素の直近の祖先要素である段落（p要素）やセクション（section要素など）内に、定義用語に対する定義を含めなければならない。
  • 説明リスト（dl要素）のdt要素内にdfn要素を配置した場合、対応するdd要素内で定義する。これにより、説明リストは、定義リストとなる。
  • ほとんどのブラウザは、dfn要素内のテキストを、イタリック体で表示する。
  • dfn要素にリンクしたa要素で括ったテキストは、定義済みの用語であることを示す。
  • dfn要素にtitle属性を指定すると、title属性値が、定義用語となる。
  • dfn要素にtitle属性がなく、dfn要素の内容が、title属性を指定したabbr要素が1つだけであれば、abbr要素のtitle属性値が定義用語となる。

属性

任意属性

属性 説明
title属性 定義用語を指定する属性。

サンプルコード

title属性なし

<dfn>HTML</dfn>

title属性あり

<dfn title="HyperText Markup Language">HTML</dfn>

サンプル

段落内で定義

HTMLソースコード
<p><dfn>HTML5</dfn>とは、有名なマークアップ言語であるHTMLの５回目の大改訂版です。</p>
実際の表示

HTML5とは、有名なマークアップ言語であるHTMLの５回目の大改訂版です。

定義リスト

HTMLソースコード
<dl>
	<dt><dfn>定義用語Ａ</dfn></dt>
		<dd>定義用語Ａの定義</dd>
	<dt><dfn>定義用語Ｂ</dfn></dt>
		<dd>定義用語Ｂの定義１</dd>
		<dd>定義用語Ｂの定義２</dd>
	<dt><dfn>定義用語Ｃ</dfn></dt>
	<dt><dfn>定義用語Ｄ</dfn></dt>
		<dd>定義用語Ｃと定義用語Ｄの定義</dd>
</dl>
実際の表示
定義用語Ａ
定義用語Ａの定義
定義用語Ｂ
定義用語Ｂの定義１
定義用語Ｂの定義２
定義用語Ｃ
定義用語Ｄ
定義用語Ｃと定義用語Ｄの定義

dfn要素にリンク

HTMLソースコード
<p><dfn id="sampleId">HTML5</dfn>とは、有名なマークアップ言語であるHTMLの５回目の大改訂版です。</p>
<p>「こんにちは♪」と表示するコードを、<a href="#sampleId">HTML5</a>で書いてみましょう。</p>
実際の表示

HTML5とは、有名なマークアップ言語であるHTMLの５回目の大改訂版です。

「こんにちは♪」と表示するコードを、HTML5で書いてみましょう。

dfn要素のtitle属性値が定義用語

dfn要素にtitle属性を指定すると、title属性値が、定義用語となる。

HTMLソースコード
<p><dfn title="HyperText Markup Language">HTML</dfn>とは、ウェブドキュメントを記述するためのマークアップ言語です。</p>
実際の表示

HTMLとは、ウェブドキュメントを記述するためのマークアップ言語です。

abbr要素のtitle属性値が定義用語

dfn要素にtitle属性がなく、dfn要素の内容が、title属性を指定したabbr要素が1つだけであれば、abbr要素のtitle属性値が定義用語となる。

HTMLソースコード
<p><dfn><abbr title="HyperText Markup Language">HTML</abbr></dfn>とは、ウェブドキュメントを記述するためのマークアップ言語です。</p>
実際の表示

HTMLとは、ウェブドキュメントを記述するためのマークアップ言語です。