HTML <em> 要素は、強調されたテキストを示します。<em> 要素は入れ子にすることができ、入れ子の段階に応じてより強い程度の強調を表すことができます。

コンテンツカテゴリー フローコンテンツフレージングコンテンツ、パルパブルコンテンツ
許可された内容 フレージングコンテンツ
タグの省略 不可。開始と終了タグの両方が必要。
許可された親要素 フレージングコンテンツ を受け入れるすべての要素
許可された ARIA ロール すべて
DOM インターフェイス HTMLElement。Gecko 1.9.2 (Firefox 4) 以前では、この要素には HTMLSpanElement インターフェイスが実装されています。

属性

この要素は グローバル属性 のみを持っています。

使用上の注意

通常、この要素は斜体で表示されます。しかしながら、単に斜体のスタイルを適用するために用いるべきではなく、そのような目的のためには <i> 要素あるいは CSS のスタイリングを使用してください。作品 (書籍、演劇、歌など) の題名を示すためには、<cite> 要素を使用してください。これも通常、斜体のスタイルとなりますが、異なる意味を持っています。周辺のテキストよりも高い重要性を持つテキストを示すためには、<strong> 要素を使用してください。

<em> 要素はしばしば、暗示的あるいは明示的な対比を表すために使われます。

<p>
  In HTML 5, what was previously called
  <em>block-level</em> content is now called
  <em>flow</em> content.
</p>

表示結果

In HTML 5, what was previously called block-level content is now called flow content.

<i> と <em>

ウェブサイトの描画について、同じものを表現するにも実に多くの方法があるため、新しい開発者をしばしば混乱させています。斜体と強調はおそらく、もっともよく目にする事柄のひとつでしょう。なぜ <em></em><i></i> を使い分けるのでしょうか。どちらも、間違いなく同じ結果をもたらしますよね?

いいえ、それは違います。デフォルトでは視覚的な結果が同じで、どちらも内容物を斜体で表示します。しかし、セマンティックな意味合いは異なります。<em> タグはその内容物を強調することを表す一方、<i> タグはセマンティックな意味を表さずに映画や書籍の名称、外国語、あるいは用語の定義を参照する語句といったテキストを通常の文から抜き出すことを意味します。

<em> の例は "Just do it already!" や "We had to do something about it" です。テキストを読む人やソフトウェアは、斜体の単語を強調して読み上げるでしょう。

<i> の例は "The Queen Mary sailed last night" です。ここで、"Queen Mary" という語句に強調や重要性は与えていません。これは単に、対象物が Mary という名前の女王ではなく Queen Mary という名前の船であることを示します。<i> の別の例として "The word the is an article" があります。

仕様

仕様書 策定状況 コメント
HTML Living Standard
<em> の定義
現行の標準  
HTML5
<em> の定義
勧告  
HTML 4.01 Specification
<em> の定義
勧告  

ブラウザー実装状況

機能 Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
基本サポート 1.0 (有) (有) (有) (有) (有)
機能 Android Edge Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
基本サポート (有) (有) (有) (有) (有) (有)

関連情報

ドキュメントのタグと貢献者

 このページの貢献者: yyss, ethertank, sii
 最終更新者: yyss,