HTMLのタグとは？定義用語のマークアップ方法を実例付きで解説

HTMLの<dfn>タグは、専門用語や略語など「定義の対象となる語」が文書内で最初に登場する箇所を示すための要素です。多くのブラウザでは、<dfn>タグで囲まれた部分は斜体（イタリック体）で表示されます。

それでは、<dfn>タグの具体的な実装例を見ていきましょう。

コード例

<!DOCTYPE html>
<html>
<body>
<h2>MCAの科目一覧</h2>
<p><dfn title="Master of Computer Applications">MCA</dfn;は、修業年限3年の大学院課程（ポストグラデュエート）の学位です</p>
<p>以下は1学期（セメスター1）の科目です...</p>
<dl>
    <dt>JavaScript</dt>
       <dd>スクリプト言語です。</dd>
    <dt>Java</dt>
       <dd>プログラミング言語です。</dd>
    <dt>jQuery</dt>
       <dd>JavaScriptライブラリです。</dd>
    <dt>C#</dt>
       <dd>オブジェクト指向プログラミング言語です。</dd>
</dl>
</body>
</html>

上記のコードをブラウザで表示すると、次のような出力になります。title属性に設定したテキストも確認できます。

HTMLの dfn タグとは？定義用語のマークアップ方法を実例付きで解説

コードの解説

この例では、<dfn>タグを次のように記述しています。

<p><dfn title="Master of Computer Applications">MCA</dfn> は、修業年限3年の大学院課程の学位です</p>

<dfn>タグは「MCA」という用語を定義していることを示すために使われています。title属性には正式名称である「Master of Computer Applications（コンピュータ応用修士）」を指定しており、ページ閲覧者がMCAという文字にマウスカーソルを重ねると、この説明がツールチップとして表示されます。

さらに、定義リスト（<dl>・<dt>・<dd>）を組み合わせることで、MCAの1学期に履修する科目名とその簡単な説明を、見やすい形で整理して表示しています。

<dfn>タグの主なポイント

文書内でその用語が最初に出現する箇所に使用するのが基本ルール
多くのブラウザでは斜体で表示される
title属性を指定すると、マウスオーバー時に補足説明を表示できる
<abbr>タグなどと組み合わせて、略語の意味をより明確に伝えることも可能

HTMLのembedタグとは？使い方と主な属性をわかりやすく解説

HTML DOMのactiveElementプロパティとは？使い方とサンプルコードを解説

HTMLのdlタグとは？記述リストの作成方法をサンプルコード付きで解説
HTMLのdlタグとは HTMLの<dl>要素は、記述リスト（description list）を定義するために使用されるタグです。HTML5では<dl>は「記述リスト」を表しますが、HTML4では「定義リスト（definition list）」として扱われていました。この違いを理解しておくと、より適切なマークアップができるようになります。記述リストは、用語とその説明をセットで表示したい場合に便利な要素で、用語集、FAQ、メタデータの表示など、さまざまな場面で活用できます。 dlタグの基本構造 <dl>タグは、以下の2つの要素と組み合わせて使用します。
HTMLのembedタグとは？使い方と主な属性をわかりやすく解説
<embed>タグとは<embed>タグは、HTML文書の中に外部アプリケーションやプラグインコンテンツ（PDFファイル、動画、音声など）を埋め込むための要素です。開始タグのみで構成され、基本的に終了タグは不要です。<embed>タグで使用できる主な属性は以下の通りです。height：埋め込むコンテンツの高さをピクセル単位で指定します。src：埋め込む外部ファイルのアドレス（URL）を指定します。type：埋め込みコンテンツのメディアタイプ（MIMEタイプ）を指定します。例：「application/pdf」など。width：埋め込むコンテンツの幅をピクセル