HTML em element

HTMLの<em>タグは、語句を強調します。

構文

開始タグ <em> と終了タグ </em> に囲まれた文字列を強調します。

<em>
  <!-- phrasing content -->
</em>

開始タグと終了タグの間にはインライン要素を含めることができます。終了タグは省略できません。属性はすべて省略可能です。

HTMLタグ <em> の使用例と表示サンプルを次に示します。

The <em>quick brown</em> fox jumps over the lazy dog.

The quick brown fox jumps over the lazy dog.

日本語の強調

英語では強調する語句をイタリック体で表記する習慣がある。そのため、英語のフォントでは強調する語句がイタリック体で表示される。

日本語のフォントにはイタリック体が用意されていないことが多い。そのため、日本語の語句を強調しても、表示上変わらないことがある。

語句を<em>強調</em>することができます。

語句を強調することができます。

日本語では強調する語句に傍点を打ったり、太字で表記する習慣がある。

太字で強調する

太字で表示するには、font-weight CSSプロパティを使用する。

語句を<em style="font-weight: bold;">強調</em>することができます。

語句を強調することができます。

傍点で強調する

語句に傍点を打つには、text-emphasis または -webkit-text-emphasis CSSプロパティを使用する。

語句を<em style="text-emphasis: dot; -webkit-text-emphasis: dot;">強調</em>することができます。

語句を強調することができます。

属性

em要素には次に示す属性を指定できる。

class
CSSのクラスを指定する。空白で区切って、複数のクラスを指定することができる。
dir
テキストを記述する方向を指定する。
id
HTML文書内で一意な識別子を指定する。
lang
この文書が何語で記述されているかを指定する。
ondblclick
マウスのボタンがダブルクリックされたときに実行するJavaScriptを指定する。
onmousedown
マウスのボタンが押下されたときに実行するJavaScriptを指定する。
style
CSSのプロパティを指定する。セミコロンで区切って、複数のプロパティを指定することができる。
title
ツールチップに適した要素のアドバイザリ情報を指定する。

カテゴリ

em要素は次に示すカテゴリに属する。

コンテンツ・モデル

em要素の内容にはフレージング・コンテンツを含めることができる。具体的には次の要素である。

タグの省略

em要素はタグを省略できない。

JavaScript

JavaScriptからは HTMLElement インタフェースを通じてem要素へアクセスできる。

let dir = document.getElementById('em1').dir
let lang = document.getElementById('em1').lang
let title = document.getElementById('em1').title

参考文献

Web Hypertext Application Technology Working Group (2022) "Text-level semantics" HTML Living Standard