HTML辞書ホームへ
HTML要素 辞書 by Sentaro
<dfn>
定義語（Definition）要素。周囲のコンテンツが定義する用語を示すために使用されます。
info
概要
<dfn> 要素は、周囲のテキスト内で定義されている用語、つまり「**定義語**」を示すために使用されます。要素自体は、ブラウザで通常**イタリック体**で表示されます。
<p> や <section> のような親要素、または <dl>, <dt>, <dd> のグループ内で使用されることが想定されています。
play_circle
デモ (静的表示)
HTML (Source)
<p>
<dfn title="文書を構成する要素の集まり">HTML</dfn>
は、HyperText Markup Language の略です。
</p>
<dl>
<dt><dfn>セマンティクス</dfn></dt>
<dd>意味論。HTMLでは、要素が持つ意味のことです。</dd>
</dl>
Preview (Result)
HTML は、HyperText Markup Language の略です。
- セマンティクス
- 意味論。HTMLでは、要素が持つ意味のことです。
list
属性 (Attributes)
| 属性名 | 説明 |
|---|---|
| title | オプション。定義語の正式な名称や略されていない形式、あるいは定義そのものを指定できます。 |
| id | オプション。その用語を指す他の場所からのリンク先（アンカー）として使用できます。 |
| （グローバル属性） | すべてのHTML要素で使用できるグローバル属性（class, style, langなど）が使用可能です。 |
code
実用例
1. title属性で定義を示す
<p>
<dfn title="Webの構造と内容を記述するためのマークアップ言語">HTML</dfn>
は、ほとんどのWebページで使用されています。
</p>
2. 定義リスト (<dl>) で使用する
<dl>
<dt><dfn>CSS</dfn></dt>
<dd>Cascading Style Sheets の略で、HTML要素の見た目を整えるために使用されます。</dd>
<dt><dfn>DOM</dfn></dt>
<dd>Document Object Model の略で、HTML文書を操作するためのプログラミングインターフェースです。</dd>
</dl>
3. id属性を付けて、他の場所からリンクする
<p>
この機能は、<a href="#semantic">セマンティクス</a>の概念に基づいています。
</p>
...
<p>
<dfn id="semantic">セマンティクス</dfn>とは、ウェブページの内容が持つ意味的な構造を指します。
</p>
lightbulb
知っておくべき重要事項
info
定義語の決定
<dfn> 要素の定義語となるテキストは、以下の優先順位で決定されます。
title属性の値<dfn>要素の内容（要素内のテキスト）
<dfn><a href="...">用語</a></dfn>）、リンクテキストが定義語となります。
accessibility_new
アクセシビリティ
<dfn> 要素は、その用語が定義されていることをスクリーンリーダーなどの支援技術に伝えます。視覚的なスタイル（イタリック体）だけでなく、マークアップによって用語の役割を明確にすることが重要です。