文本语义层次的表达技巧

在本文中，将探讨一些可以使文本更具表现力的元素。正如下面的例子所示，使用很少的标记就能在HTML5中实现非常不同的效果。（以下示例使用的是Chrome 47版本。）

HTML代码示例：

上述示例展示了6种不同的文本语义层次。（包括普通文本，共7种。）

最简单的文本类型是普通文本。它除了表示它是文本之外，没有其他语义意义。将普通文本（以及其他所有文本片段）放在 <p> （段落）元素内，它在文档中代表一个段落。

强调元素：

第二个示例是 <em> （强调）标签，它代表句子的强调或重点。

一个例子可能是：

第一种说法可能是当某人第一次发现HTML 5可以做的惊人事情时说的。 第二种说法可能是在朋友之间的辩论中，有人声称HTML 5不棒之后说的。 第三种说法可能是在讨论中，有人说HTML 4很棒之后说的。

通过将重点放在句子的不同部分，可以显著改变句子的含义；基于上下文信息。

重要性元素：

第三个示例展示了 <strong> 元素，它代表重要性、严肃性或紧迫性。

在示例中，突出了希望首先吸引眼球的部分（重要部分）。

<strong> 元素可以嵌套，具有使每个更深层次更加重要的语义意义。

小字元素：

<small> 元素代表旁注评论，如免责声明和警告。

一个简单的思考方式是，如果它与主要主题没有直接关系，但由于其他原因（法律要求等）需要包含它，那么使用 <small> 元素。

可能想要使用 <small> 元素的一个示例是，如果有一个推广儿童玩具的网站。“不含电池”将是使用 <small> 元素的完美情况。

另一个示例是使用 <small> 元素围绕页面的版权信息。

删除线元素：

<s> 元素代表不再准确或相关的内容。

如果一个产品正在打折，可以使用 <s> 元素显示原始价格；现在已经过时了。然后使用 <strong> 元素显示新元素。

重要的是要注意，<s> 元素不应该用于指示从文档中删除，而应该使用 <del> 元素用于此目的。

引用元素：

<q> 元素代表引用。

正如从上面的例子中看到的，不需要包括引号（实际上不应该包括它们），因为Web浏览器或用户代理会为插入它们。

<q> 元素有一个可选的 cite 属性，链接到引用的来源。cite 属性必须是一个有效的URL；如果引用没有URL，则不要使用 cite 属性。

规范指出，<q> 元素是完全可选的，将引号放在引用周围同样是正确的，所以不要觉得必须将每个引用包裹在 <q> 元素中。

引用来源元素：

<cite> 元素代表对创意作品的引用。在上面的例子中，将其与 <q> 元素配对，但它完全可以单独存在。

<cite> 元素必须包括标题、作者的名字或对创意作品的URL引用。

在上面的例子中，使用它来代表作者的名字，但也可以放置书名或链接到网页。

重要的是要强调，任何创意作品都可以放在 <cite> 元素内。