dfn要素[HTML5]

<dfn>…… 用語が使用されていることを示す

<dfn>タグは、用語が使用されていることを示す際に使用します。<dfn>~</dfn>の中には用語を配置しますが、その直近の親要素となる<p>・<dl>・<section>などの中には用語の定義内容を一緒に入れる必要があります。

title属性は様々な要素で使用できる汎用的な属性ですが、<dfn>にtitle属性を指定した場合には特別な意味を持ちます。<dfn>のtitle属性には、定義される用語の正式な名称を指定します。また、<dfn>~</dfn>の直下に<abbr>を配置した場合には、<abbr>のtitle属性の値が定義される用語の正式な名称を表すことになります。

dfn要素の祖先となる要素にtitle属性を指定しても、dfn要素には影響を与えません。

■HTML4.01からHTML5へのバージョンアップによる変更点

dfn要素は、HTML4.01からHTML5へのバージョンアップで大きな変更はありません。

■使用できる属性

title属性
定義される用語の正式な名称を指定

以下の使用例では、<dfn>の直下に<abbr>を配置して、定義される用語の正確な名称を指定しています。また、二度目に用語が登場する箇所では、最初に用語が登場した箇所へリンクすることで、同じ用語であることを明確に示しています。

■HTML5での使用例

[html]
<p>
いま解説している
<dfn id="sample">
<abbr title="HyperText Markup Language">HTML</abbr>
</dfn>
は、ウェブページを作成するための言語の一つです。
</p>
<p>
<a href=#sample><abbr title="HyperText Markup Language">HTML</abbr></a>
はそれほど難しいものではありません。簡単なウェブページなら
数種類のタグを覚えれば十分に作成することが可能です。
</p>
[/html]

参考:http://www.htmq.com/html5/dfn.shtml

カテゴリー: HTML5, HTMLの基礎知識, ナレッジノート   パーマリンク