html强调标记

在你的网页设计教育中，你将学到的一个标签是一对称为“强调标签”的标签。让我们来看看这些标签是什么，以及它们是如何在今天的网页设计中使用的。...

在你的网页设计教育中，你将学到的一个标签是一对称为“强调标签”的标签。让我们来看看这些标签是什么，以及它们是如何在今天的网页设计中使用的。

回到xhtml

如果您在几年前就学会了HTML，在HTML5兴起之前，您可能同时使用了粗体和斜体标记。正如您所料，这些标记将元素分别转换为粗体文本或斜体文本。这些标签的问题，以及为什么它们被推到一边而支持新元素（我们将很快看到），是它们不是语义元素。这是因为它们定义了文本的外观，而不是有关文本的信息。请记住，HTML（这些标记将被写入其中）都是关于结构的，而不是视觉样式！视觉效果是由CSS处理的，而web设计最佳实践长期以来一直认为，您应该在web页面中明确区分样式和结构。这意味着不使用非语义元素，也不使用细节元素而不是结构元素。这就是为什么粗体和斜体标记通常被strong（粗体）和emphasis（斜体）取代的原因。

&lt；strong&gt；及&lt；em&gt；

“强”和“强调”元素为文本添加了信息，详细说明了在讲述内容时应区别对待和强调的内容。您使用这些元素的方式与过去使用粗体和斜体的方式基本相同。只需用开始和结束标记（用于强调和强强调）围绕文本，所附文本将被强调。

您可以嵌套这些标记，而哪一个是外部标记并不重要。这里有一些例子。

This text is emphasized and most browsers would display it as italics. This text is strongly emphasized and most browsers would display it as bold type

在这两个例子中，我们并不是在用HTML描述视觉效果。是，默认的&lt；em&gt；标签应为斜体，且&lt；strong&gt；将是粗体的，但这些外观可以很容易地在CSS中更改。这是两全其美。您可以利用默认浏览器样式在文档中获取斜体或粗体文本，而不需要实际越界，也不需要混合结构和样式。说你想要那样&lt；strong&gt；文本不仅要粗体而且要红色，您可以将其添加到SCS中

strong {color: red;}

在本例中，您不需要为粗体字体权重添加属性，因为这是默认值。但是，如果您不想将其留给偶然，您可以随时将其添加到：

strong {font-weight: bold;color: red;}

现在，您几乎可以保证在使用标记的任何地方都有一个带有粗体（和红色）文本的页面。

加倍强调

一年来我们注意到的一件事是，如果你试图加倍强调，会发生什么。例如：

This text should have both bolded and italicized text inside it.

您可能认为这一行将生成一个包含粗体和斜体文本的区域。有时确实会发生这种情况，但我们已经看到一些浏览器只支持两种强调样式中的第二种，即最接近实际文本的强调样式，并且只显示为斜体。这就是为什么我们不加倍强调标签的原因之一。

避免这种“双重化”的另一个原因是出于文体目的。一种强调形式通常足以表达你想要设定的语气。您不需要加粗、斜体、上色、放大和在文本下面加下划线就可以让它脱颖而出。那篇文章，所有这些不同的强调，都会变得花哨。因此，在使用强调标记或CSS样式来提供强调时要小心，不要过度。

关于粗体和斜体的注记

最后一个想法是，虽然不再推荐使用粗体（）和斜体（）标记作为强调元素，但有些web设计师使用这些标记来设置文本内联区域的样式。基本上，他们把它当作一个元素来使用。这很好，因为标记非常短，但通常不建议以这种方式使用这些元素。我们提到它是为了防止你在一些网站上看到它不是用来创建粗体或斜体文本的，而是用来为其他视觉样式创建CSS钩子。