<strong> vs. font-weight:bold&<em> vs. font-style:italic

Question

使用<strong>和<em>替代CSS属性之间是否有任何真正的区别:

font-weight: bold;
font-style: italic;

另外,两种选择存在的真正原因是什么？我可能是错的,但没有,<strong>并<em>在很长一段时间后出现在现场font-weight,font-style成为标准的CSS属性？如果是这样,他们必须有一些理由.

Answer 1

HTML代表意义; CSS代表外观.如何在文档中标记文本不取决于该文本在屏幕上的显示方式,而仅仅取决于它的含义.另一个例子是font-weight: bold,默认情况下,其他一些HTML元素(如标题)的样式,但它们使用<h1>- <h6>,not <strong>或标记<b>.

在HTML5中,您<strong>用来表示句子的重要部分,例如:

<p><strong>Do not touch.</strong> Contains <strong>hazardous</strong> materials.

并且您<em>用来表示语言压力,例如:

<p>A Gentleman: I suppose he does. But there's no point in asking.
<p>A Lady: Why not?
<p>A Gentleman: Because he doesn't row.
<p>A Lady: He doesn't <em>row</em>?
<p>A Gentleman: No. He <em>doesn't</em> row.
<p>A Lady: Ah. I see what you mean.

这些元素是默认情况下恰好具有粗体和斜体表示的语义元素,但您可以随意设置它们的样式.例如,在<em>上面的示例中,您可以用大写而不是斜体来表示压力强调,但<em>元素的功能目的保持不变 - 通过强调特定的单词或短语来改变句子的上下文:

em {
    font-style: normal;
    text-transform: uppercase;
}

请注意,原来的答案(下)适用于HTML标准之前,HTML5,其中<strong>并<em>有稍微不同的含义,<b>并且<i>是纯粹的表象和有没有任何语义.像<strong>和<em>分别,它们具有类似表象的默认设置,但是可以以不同的风格.

您分别使用<strong>和<em>表示强调和正常强调.

或者认为它是这样的:font-weight: bold更接近<b>比<strong>,并且font-style: italic更接近<i>比<em>.这些视觉风格纯粹是视觉的:像屏幕阅读器这样的工具不会理解粗体和斜体的含义,但有些屏幕阅读器能够以更强调的语调阅读<strong>和发<em>短信.

Answer 2

的<em>元件-从W3C(HTML5参考)

是!有明显的区别.

该<em>元素代表其内容的重点强调.特定内容的重点程度由其祖先<em>元素的数量给出.

<strong>  =  important content
<em>      =  stress emphasis of its contents

重点的放置改变了句子的含义.因此,该元素构成了内容的组成部分.以这种方式使用强调的确切方式取决于语言.

注意!

1. 该<em>要素也不是为了表达重要性; 为此目的,该<strong>元素更合适.

2. 该<em>元素不是通用的"斜体"元素.有时,文本旨在从段落的其余部分中脱颖而出,就好像它的情绪或声音不同.为此,i元素更合适.

参考(示例):参见W3C参考

Answer 3

问题是语义(如BoltClock提到)和视觉呈现的问题.

最初使用的HTML <b>和<i>用于这些目的的完全风格命令,放在文档标记的语义环境中.CSS试图尽可能地分离出媒体的文体元素.因此,粗体和斜体等样式信息应该放在CSS中.

<strong>并且<em>被引入以填充文本的语义需求以被标记为更重要或更强调.它们具有类似于粗体和斜体的默认风格解释,但它们并不受命运的束缚.