<u>
在HTML5中,<u>
元素表示,将文本标记为应用了某种形式的非文本注释。例如将文本标记为中文文本中的专有名称(一个正确的中文标记),或将文本标记为拼写错误。
浏览器支持
![]() | ![]() | ![]() | ![]() | ![]() |
所有主流浏览器都支持<u> 标签。 |
示例
<p>this is a <u>parragraph</u>.</p>
this is a parragraph.
标签定义及使用说明
<u>
在 HTML4 中废弃,但是在 HTML 5 中恢复了一个新的语义,意思是:将文本标记为应用了某种形式的非文本注释。
<u>
标签定义与常规文本风格不同的文本,像拼写错误的单词或者汉语中的专有名词。为文本加下划线。<u>
标签的有效用例包括注释拼写错误,应用proper name mark来表示中文文本中的专有名称以及其他形式的注释。但是,您不应该使用<u>
简单地为文字加下划线,或者表示书籍的标题。请尽量避免使用<u>
标签为文本加下划线,用户会把它混淆为一个超链接。在可能和超链接混淆的地方,避免使用<u>
。要为文本加下划线,您应该应用包含CSStext-decoration:underline
的样式。
HTML5 规范建议开发者尽量使用其他元素替代<u>
元素。在大多数情况下,您应该使用<u>
以外的元素,例如:
<strong> | 表示重要的文本。 |
<mark> | 突出显示的文本,高亮显示。 |
<m> | 突出显示文本。 |
<em> | 呈现为被强调的文本。 |
<i> | 表示非普通文本。例如技术术语、外文短语(西方语言体系中的成语俗语)或是小说中人物的思想、宇宙飞船的名字等等。 |
<u> | 表示文本标记为拼写错误。或者表示汉语中的专有名称。 |
<dfn> | 定义一个专业术语。或者定义一个缩写名称。 |
<cite> | 定义一个作品的标题。也可以表示一个作品的引用。可使用该标签引用参考文献,比如书籍或杂志的标题。 |
<q> | 短引用。在行内,引用短文本的。这个标签是用来引用短的文本。 |
<blockquote> | 块级引用。代表其中的文字是大篇幅的引用内容。 |
<code> | 表示计算机代码文本。 |
<samp> | 表示样本文本。 |
<kbd> | 表示键盘文本。它表示文本是从键盘上键入的。它经常用在与计算机相关的文档或手册中。 |
<var> | 定义变量。您可以将此标签与<pre> 及<code> 标签配合使用。 |
内容类别 | 流式内容,短语内容,palpable 内容。 |
---|---|
允许的内容 | 短语内容 |
标签省略 | 不允许,开始标签和结束标签都不能省略。 |
允许的父元素 | 任何接受短语内容的元素。 |
允许的 ARIA 角色 | 任意 |
DOM 接口 | HTMLElement Gecko 1.9.2(Firefox 4)之前(包含), Firefox 为这个元素实现了HTMLSpanElement 接口。 |
HTML 4.01 与 HTML5之间的差异
在 HTML 中,<u>
元素已废弃(<u>
元素被用来定义下划线)。
HTML5 中冲定义了<u>
元素,它定义与常规文本风格不同的文本,像拼写错误的单词或者汉语中的专有名词。
属性
这个元素仅包含全局属性。
全局属性
<u>
标签支持HTML 的全局属性。
事件属性
<u>
标签支持HTML 的事件属性。
示例
表示拼写错误
此示例使用<u>
元素和一些CSS来显示包含拼写错误的段落,其中错误以红色波浪下划线样式表示,这种情况通常用于此目的。
//html <p>this paragraph includes a <u class="spelling">wrnogly</u> spelled word.</p>
在HTML中,我们看到<u>
使用了一个类spelling
,用于表示“wrongly”一词的拼写错误。
//CSS u.spelling { text-decoration: red wavy underline; }
这个CSS表示当<u>
元素使用类spelling
进行样式化时,它的文本下面应该有一个红色的波浪下划线。这是拼写错误的常见样式。也可以使用另一种常见样式red dashed underline
.。
避免使用<u>
大多数情况下,您实际上不想使用<u>
。以下是一些示例,显示在几种情况下您应该做什么。
非语义下划线
要在不暗示任何语义含义的情况下为文本加下划线,请使用<span>
元素并将text-decoration
属性设置为"underline"
,如下所示。
//html <span class="underline">today's special</span> <br> chicken noodle soup with carrots
//CSS .underline { text-decoration: underline; }
表示书名
书籍标题应使用<cite>
元素,而不是<u>
,也不能使用<i>
来呈现。
<p>the class read <cite>moby dick</cite> in the first term.</p>
请注意:<cite>
元素的默认样式,会以斜体显示文本。如果您愿意,可以使用CSS覆盖它:
cite { font-style: normal; text-decoration: underline; }