<u>：非言語的な注釈があることを示して下線（アンダーライン）を引く要素・HTMLタグの解説

<u>タグの解説

<u>は、指定した範囲に非言語的な注釈があることを示します。かつてこの要素は、文字列にアンダーラインを引くために使用されていましたが、HTML5以降で意味論的な役割りが与えられました。

<u>を使用する範囲として適切な箇所は、文脈的に注意を促したい非言語的な範囲です。例えば、英語で表記した場合のスペルミスや、誤読を招きかねない固有名詞などです。

明示できる答えや出典がある場合は、別のタグを採用しましょう。

• <i>：慣用句や特定の用語を表す
• <mark>：キーワードやフレーズをマークする
• <cite>：出典先、参照先を示す
• <em>：強調する
• <strong>：重要、重大、緊急を表す

<u>タグの特徴

• レイアウトの初期値はインラインです。文章の改行には影響を与えません。
• 視覚的な効果として下線（アンダーライン）が引かれます。この装飾はハイパーリンクと誤認される可能性があるため、CSS（スタイルシート）での調整を推奨します。
• 同一のページ内に複数使うことができます。ただし、この要素自体を入れ子にすることはできません。

<u>要素に指定できる属性

グローバル属性

全てのHTML要素に指定できる共通の属性です。詳細は一覧表で解説します。

イベントハンドラ

全てのHTML要素に指定できるコンテンツ属性です。

<u>要素の使い方とサンプルコード

この要素の最も基本的な書き方は以下の通りです。文章の中で何らかの非言語的な注釈を与えたい箇所に適用します。

text <u>something</u> text

主要なブラウザでは、<u>で囲った部分に下線（アンダーライン）が引かれます。これがどのように表示されるのか、確かめてみましょう。

<p>Ｑ：リダイレクトを設定しようとしましたが <u>.htacsess</u> が見つかりません。</p>
<p>Ａ:正しいファイル名は「.htaccess」です。もう一度探してみましょう。</p>

通常のアンダーラインで装飾されると、ハイパーリンクのアンカーとの違いが分かりません。そこで、CSSのtext-decoration関連のプロパティを使って装飾の調整を行います。

.u-text {
	text-decoration-color: #d61a1a;
	text-decoration-style: wavy;
	text-decoration-thickness: 1px;
	text-underline-offset: 1px;
}