<em>：強調元素

嘗試一下

<p>Get out of bed <em>now</em>!</p>

<p>We <em>had</em> to do something about it.</p>

<p>This is <em>not</em> a drill!</p>

/* stylelint-disable-next-line block-no-empty */
em {
}

屬性

此元素僅包括全域屬性。

使用注意事項

<em> 元素用於具有與周圍文本相比的強調重點的單詞，通常僅限於句子的一個詞或幾個詞，並影響句子本身的含義。

通常，此元素以斜體類型顯示。然而，不應該用於應用斜體樣式；請使用 CSS 的 font-style 屬性來實現此目的。使用 <cite> 元素標記作品的標題（書籍、劇本、歌曲等）。使用 <i> 元素標記以替代音調或情緒的文本，這包括許多斜體的常見情況，如科學名稱或其他語言的單詞。使用 <strong> 元素標記比周圍文本更重要的文本。

<i> vs. <em>

某些開發人員可能會對多個元素產生看似相似的視覺結果感到困惑。<em> 和 <i> 是一個常見的例子，因為它們都使文字變斜。差異在哪裡？應該使用哪個？

默認情況下，視覺結果相同。然而，語義含義是不同的。<em> 元素表示其內容的強調重點，而 <i> 元素表示與正常散文有所區別的文本，例如外來詞、虛構角色的思想，或當文本指的是詞的定義而不是表示其語義含義時。 （作品的標題，如書籍或電影的名稱，應使用 <cite>。）

這意味著使用的正確選擇取決於情況。兩者都不是純粹為了裝飾而使用的，這是 CSS 樣式的用途。

<em> 的一個例子可能是：「Just do it already!」或：「We had to do something about it」。閱讀文本的人或軟件將使用重音強調斜體字。

<i> 的一個例子可能是：「Queen Mary 昨晚啟航了」。在這裡，「Queen Mary」 這個詞並沒有額外的強調或重要性。僅僅指出了問題物體不是一位名叫 Mary 的女王，而是一艘名為 Queen Mary 的船。<i> 的另一個例子可能是：「The word the is an article」。

範例

在此範例中，<em> 元素用於突顯兩個成分列表之間的內隱或顯性對比：

<p>
  Ice cream is made with milk, sweetener, and cream. Frozen custard, on the
  other hand, is made of milk, cream, sweetener, and <em>egg yolks</em>.
</p>

結果

技術摘要

規範

瀏覽器相容性

參見

• <i>