CSS：em 和 strong 的區別

表現

em vs strong

在瀏覽器中，<em> 默認用斜體表示，<strong> 用粗體表示。從樣式表現上，<strong> 更加突出，更容易吸引眼光。顯然，這種視覺上的差別設計是有目的的。

程度

EM: Indicates emphasis.
STRONG: Indicates stronger emphasis.

在 HTML 4.01 的說明 中，em 表示強調，strong 表示更強烈的強調。從二者視覺樣式上的特色來講，這種「程度上」的解釋確實有道理。

但把兩者放在一大段落、一遍文章中時，讀者第一眼確定注意到的是粗體的 strong，而很難第一時間找到斜體不加粗的 em，所以每每是當讀者讀到某一處時，纔會發現這種強調，與 strong 的這種不看內容但馬上就凸顯出關鍵詞句的強調相比，em 更偏向於用來局部強調，而strong 則是全局強調。

所以，光從兩者強調程度上的強弱已經不足以說明其區別。

語意

在 HTML 5 中，進一步規定了二者的區別：

The em element represents stress emphasis of its contents.
The strong element represents strong importance, seriousness, or urgency for its contents.

MDN 中也將二者進行了對比，Emphasis vs. Strong：

While in HTML4, Strong simply indicated a stronger emphasis, in HTML5, the element is described as representing "strong importance for its contents." This is an important distinction to make. While Emphasis is used to change the meaning of a sentence ("I love carrots" vs. "I love carrots"), Strong is used to give portions of a sentence added importance (e.g., "Warning! This is very dangerous.") Both Strong and Emphasis can be nested to increase the relative degree of importance or stress emphasis, respectively.

em 和 strong 已經不能夠再用 HTML4 中從強調的程度來簡單區分差異了。

• em 表示內容的着重點（stress emphasis），放置的位置會改變所在句子的含義。
• strong 表示內容的重要性（strong importance），強調句子的重要性而不會改變所在句子的語意。

例子

注：下面的例子中，斜體爲 em，粗體爲 strong。

Cats are cute animals.
強調貓，討論的是哪一種動物聰明可愛。

Cats are cute animals.
強調是，討論的是貓是否是可愛。

Cats are cute animals.
強調可愛，討論的是貓到底是可愛仍是不可愛。

"Warning! This is very dangerous".
strong 表示的是重要性上的強調，不會引發句子意思的變化。

<p><strong>Warning.</strong> This dungeon is dangerous.
<strong>Avoid the ducks.</strong> Take any gold you find.
<strong><strong>Do not take any of the diamonds</strong>,
they are explosive and <strong>will destroy anything within
ten meters.</strong></strong> You have been warned.</p>

注：em 和 strong 都可嵌套來加強其程度。

參考

• W3C: Text
• HTML Living Standard: The strong element
• MDN: <strong>
• stackoverflow: <strong> vs <em>?
• 藍色理想：em 和 strong 的區別
• Emphasis in context versus overall highlighting