<u> はHTML の要素で、非言語的に注釈があることを示す方法で表示する行内テキストの区間を示します。これは既定で単純な実線の下線として表示されますが、 CSS を使用して変更することもできます。

試してみましょう

<p>  You could use this element to highlight <u>speling</u> mistakes, so the writer  can <u>corect</u> them.</p>

p {  margin: 0;}u {  text-decoration: #f00 wavy underline;}

<u> を使用するのがどのような場合に適切で、どのような場合に適切でないのかについての詳細は、使用上の注意を参照してください。

属性

この要素にはグローバル属性のみがあります。

使用上の注意

他の純粋な整形要素と同様に、以前の HTML の下線 (<u>) 要素は HTML 4 で非推奨になりました。しかし<u> は、 HTML 5 で新しい意味論的な、何らかの曖昧な注釈が適用されるテキストをマークするという意味で復活しました。

用途

<u> 要素の有効な用途としては、綴りエラーの通知、中国語の文字列の固有名詞記号の記述、その他の形の注釈などがあります。

単に表現の目的で下線を引いたり、本の題名を記述したりするために<u> を使用するべきではありません。

仕様を考慮するべきその他の要素

多くの場合、次のような場合は<u> よりも他の要素を使用するべきです。

• <em>: 強調の記述
• <b>: テキストに注意を引かせる
• <mark>: キーワードや句をマーク
• <strong>: 強い重要性のあるテキストを示す
• <cite>: 書籍やその他の出版物の題名をマーク
• <i>: 西洋言語のテキストで技術用語、音訳、考え、船名などを記述

（<u> で作成された非言語的な注釈に対して）言語的な注釈を提供する場合は、<ruby> 要素を使用してください。

意味論的な意味なしで下線を引きたい場合は、text-decoration プロパティの値underline を使用してください。

例

綴りエラーを表示

この例は、<u> 要素と CSS を使用して、綴り間違いのエラーを含む段落を表示し、エラー箇所をこの目的でよく使用される、赤い波線の下線スタイルで示します。

HTML

<p>This paragraph includes a <u>wrnogly</u> spelled word.</p>

この HTML では、<u> にクラスspelling を付けて、 "wrongly" という語の綴りミスを示すために使用しているのが分かります。

CSS

u.spelling {  text-decoration: red wavy underline;}

この CSS は<u> 要素にクラスspelling がついてスタイル付けされるとき、テキストすぐ下に赤い波線の下線を引くことを示しています。これはスペルミスをスタイル付けするときに一般的なスタイル付けです。red dashed underline を使って表現できるスタイルもよく使われます。

結果

結果は現在利用可能なもっと有名なワープロを使ってきた人になじみがあるものでしょう。

<u> の回避

多くの場合、実際には<u> を使用したいと思わないでしょう。いくつかの場面で代わりに何をするべきかを示す例を挙げましょう。

意味を伴わない下線

意味を含むことがないテキストに下線を引くには、次のように、<span> 要素とtext-decoration プロパティに"underline" を設定したものを使用してください。

HTML

<span>Today's Special</span><br />Chicken Noodle Soup With Carrots

CSS

.underline {  text-decoration: underline;}

結果

書籍の題名の表現

書籍の題名は<u> や<i> でもなく、<cite> 要素を使用して表現してください。

HTML

<p>The class read <cite>Moby Dick</cite> in the first term.</p>

cite 要素のスタイル付け

なお、<cite> 要素の既定のスタイルではテキストを斜体で表示します。 CSS を使用して上書きすることができます。

<p>The class read <cite>Moby Dick</cite> in the first term.</p>

cite {  font-style: normal;  text-decoration: underline;}

技術的概要

仕様書

ブラウザーの互換性

関連情報

• ふつう、<span>,<i>,<em>,<b>,<cite> 要素が代わりに使用されます。
• 意味論的なものではない下線には、 CSS のtext-decoration プロパティを使用してください。