em 和 strong 的區別,可以從三個層次上來談。
首先看 html 4.01 中的說明:
em: indicates emphasis.
strong: indicates stronger emphasis.
em 表示強調,strong 表示更強烈的強調。言簡意賅,表明了 em 和 strong 的命名來歷。并且在瀏覽器中,em 默認用斜體表示,strong 用粗體表示。這是第一個層次上的區別。
第二個層次上,在 emphasis in context versus overall highlighting 和 em vs. strong 這兩篇文章中,做了很好的總結:
em 用來局部強調,strong 則是全局強調。從視覺上考慮,em 的強調是有順序的,閱讀到某處時,才會注意到。strong 的強調則是一種隨意無順序的,看見某文時,立刻就凸顯出來的關鍵詞句。斜體和粗體剛好滿足了這兩種視覺效果,因此也就成了 em 和 strong 的默認樣式。
感覺上面已經解釋得很清楚了?我們再來看看第三個層次上的區別。html5 草案 中做了詳盡解釋:
em 表示內容的著重點(stress emphasis),strong 表示內容的重要性(strong importance),strong 不會改變所在句子的語意,em 則會改變所在句子的語義。并且舉了一個非常好的例子:
<p><em>cats</em> are cute animals.</p>
強調貓,討論的是哪種動物聰明可愛。
<p>cats <em>are</em> cute animals.</p>
強調是,討論的是貓是不是聰明可愛。
<p>cats are <em>cute</em> animals.</p>
強調聰明可愛,討論的是貓究竟是聰明可愛呢還是愚蠢討厭。
<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>
strong 表示的是重要性上的強調,不會引起句子意思的變化。最后注意 em 和 strong 都可以有多重,比如可以用兩個 strong 來表示內容很重要。
可以看出,第二個層次上所說的局部強調和全局強調是不夠準確的。em 和 strong 區別的玄妙處,在 html5 草案里才得到淋漓盡致的闡釋。推薦大家有時間的時候,仔細閱讀 html5 草案。有很多元素的語義,都闡釋得非常清楚,對于我們如何在最恰當的地方使用最恰當的標簽,非常具有價值。
最后,在 前端與民工 一文的回復中,以及收到的郵件里,很遺憾的沒有發現有誰知道第三個層次上的區別。因此準備的禮品(我還真準備了10份),很落寞的發不出去了。不過這篇文章僅是個引子,接下來準備用一系列文章來探討html中元素的語義。禮品的承諾繼續有效,留給下一個話題:
請闡述dl的語義,并列舉至少5種使用場景。
可以查閱資料,將結果貼在回復里,或郵件發送給我都可以,禮物有限,前10個答對的必送。
補充:和一些朋友又討論了下,最后我的看法是:
em 是句意強調,加與不加會引起語義變化。
strong 是重要性強調,和局部還是全局無關,局部強調用strong也可以,strong強調的是重要性,不會改變句意。
新聞熱點
疑難解答