要素に補足情報を付ける

title属性は、要素の補足情報を表します。

この補足情報は、PC向けの一般的なブラウザではツールチップで表示されます。

title属性の用途

title属性は、例えば次のような用途に使用することができます。

• リンクの場合は、リンク先のタイトルや説明など。
• 画像の場合は、画像の著作権情報、撮影場所、撮影日時、その他の説明など。
• 引用の場合は、引用元に関する追加情報など。

また、以下の要素ではtitle属性に特別な意味が加わります。（詳細については各ページを参考にしてください）

link要素

リンク先のタイトル

style要素

スタイルのタイトル

dfn要素

定義される用語

abbr要素

略される前の正式名称

menuitem要素

メニュー項目のヒント

title属性の指定について

title属性の値に改行を入れると、補足情報が複数の行に分割されることになります。

<p title="補足情報1
補足情報2">要素の内容</p>

改行を入れると意味が変わってしまうような場合には、次のように1行で記述しておきます。

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

また、title属性で指定した補足情報は、その子孫要素にも関係することになります。次の例では、p要素に指定した補足情報がspan要素にも適用されます。

<p title="補足情報">p要素の内容<span>span要素の内容</span></p>

子孫要素に影響を与えたくない場合は、次のように空のtitle属性を指定しておきます。この場合、span要素には補足情報がないことを表しています。

<p title="補足情報">p要素の内容<span title="">span要素の内容</span></p>

頼りすぎないようにする

ユーザーの環境によっては、title属性の値が表示されない場合もあります（スマホやタブレット等）。そのため、HTML5の仕様書ではこの属性に頼ることは推奨しないとされています。

指定できる要素

title属性はグローバル属性のため、HTML5の全ての要素に指定することができます。