From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/zh-cn/web/html/element/em/index.html | 141 +++++++++++++++++++++++++++++ 1 file changed, 141 insertions(+) create mode 100644 files/zh-cn/web/html/element/em/index.html (limited to 'files/zh-cn/web/html/element/em/index.html') diff --git a/files/zh-cn/web/html/element/em/index.html b/files/zh-cn/web/html/element/em/index.html new file mode 100644 index 0000000000..1c3f6deca5 --- /dev/null +++ b/files/zh-cn/web/html/element/em/index.html @@ -0,0 +1,141 @@ +--- +title: +slug: Web/HTML/Element/em +tags: + - VS + - em + - i + - web 语义化 + - webgeeker + - xgqfrms +translation_of: Web/HTML/Element/em +--- +

简介

+ +

HTML 着重元素 (<em>) 标记出需要用户着重阅读的内容, <em> 元素是可以嵌套的,嵌套层次越深,则其包含的内容被认定为越需要着重阅读。

+ +
请注意: 通常地,该元素会被浏览器展示为斜体文本, 但是,它不应该仅仅用于应用斜体样式;为此目的,请使用CSS样式。使用 {{HTMLElement("cite")}} 元素标记作品的标题(书籍,戏剧,歌曲等);它通常也采用斜体样式,但具有不同的含义。使用 {{HTMLElement("strong")}} 元素标记比周围文本更重要的文本。
+ + + +

属性

+ +

此元素只包括全局属性

+ +

示例

+ +

<em> 元素通常被用于指示一个隐式或显式的对比。

+ +
<p>
+  In HTML 5, what was previously called <em>block-level</em> content is now called <em>flow</em> content.
+</p>
+ +

结果

+ +

In HTML 5, what was previously called block-level content is now called flow content.

+ +

<i> vs. <em>

+ +

新的开发人员看到多个元素产生相似的效果,经常被混淆。<em> 和 <i> 就是一对常见的例子,因为它们都对文字斜体化。它们的区别是什么?应该使用哪一个?

+ +

在默认情况下,它们的视觉效果是一样的。但语义是不同的。 <em> 标签表示其内容的着重强调,而 <i> 标签表示从正常散文中区分出的文本,例如外来词,虚构人物的思想,或者当文本指的是一个词语的定义,而不是其语义含义。(作品的标题,例如书籍或电影的名字,应该使用 <cite>。)

+ +

这意味着,正确使用哪一个取决于具体的场景。两者都不是纯粹为了装饰的目的,那是CSS样式所做的。

+ +

一个 <em> 的例子可能是:"Just do it already!",或:"We had to do something about it"。人或软件在阅读文本时,会对斜体字的发音使用重读强调。

+ +

一个 <i> 的例子可能是:"The Queen Mary sailed last night"。在这里,没有对 "Queen Mary" 这个词添加强调或重要性。它只是表明,谈论的对象不是一个名叫玛丽的女王,而是一艘名字叫玛丽的船。另一个 <i> 的例子可能是:"The word the is an article"。

+ +

说明文档

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
规范状态注释
{{SpecName('HTML WHATWG', 'text-level-semantics.html#the-em-element', '<em>')}}{{Spec2('HTML WHATWG')}}
{{SpecName('HTML5 W3C', 'text-level-semantics.html#the-em-element', '<em>')}}{{Spec2('HTML5 W3C')}}
{{SpecName('HTML4.01', 'struct/text.html#h-9.2.1', '<em>')}}{{Spec2('HTML4.01')}}
+ +

浏览器兼容性

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + +
特征ChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support1.0{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

了解更多

+ + + +
{{HTMLRef}}
-- cgit v1.2.3-54-g00ecf