标签 | 描述 |
---|---|
<em> | 呈现为被强调的文本。 |
<strong> | 定义重要的文本。 |
<dfn> | 定义一个定义项目。 |
<code> | 定义计算机代码文本。 |
<samp> | 定义样本文本。 |
<kbd> | 定义键盘文本。它表示文本是从键盘上键入的。它经常用在与计算机相关的文档或手册中。 |
<var> | 定义变量。您可以将此标签与 <pre> 及 <code> 标签配合使用。 |
本章介绍HTML短语标签,它和前面介绍的格式标签类似,以上表格为HTML短语标签,现在让我们来看看这些短语标签的用法。
强调文本<em>...</em>
<em>...</em> 元素中出现的任何内容都是显示为强调文本。
示例
<!DOCTYPE html>
<html>
<head>
<title>强调文本例子</title>
</head>
<body>
<p>以下单词使用<em>强调</em>字体。</p>
</body>
</html>
标记文本<mark>...</mark>
<mark>...</mark> 元素中出现的任何内容均显示为标记黄色。
示例
<!DOCTYPE html>
<html>
<head>
<title>标记文本例子</title>
</head>
<body>
<p>以下单词已被<mark>标记</mark>为黄色</p>
</body>
</html>
重要文本<strong>...</strong>
<strong>...</strong> 中出现的任何内容元素显示为重要文本。
示例
<!DOCTYPE html>
<html>
<head>
<title>重要文本例子</title>
</head>
<body>
<p>以下单词使用<strong>重要文本</strong>字体。</p>
</body>
</html>
文本缩写<abbr>...</abbr>
您可以通过将文本放在 <abbr>...</abbr> 标签中来缩写文本。如果存在,标题属性必须包含完整的描述,仅包含其他内容。
示例
<!DOCTYPE html>
<html>
<head>
<title>文本缩写例子</title>
</head>
<body>
<p>我最好朋友的名字是<abbr title = "王小明">王小明</abbr>。</p>
</body>
</html>
缩写元素<acronym>...</acronym>
<acronym>...</acronym> 标记之间的文本是首字母缩略词。
目前,主要浏览器不会更改内容的外观。
示例
<!DOCTYPE html>
<html>
<head>
<title>缩写元素例子</title>
</head>
<body>
<p>本章介绍在 <acronym>XHTML</acronym> 中标记文本。</p>
</body>
</html>
文本方向<bdo>.. .</bdo>
<bdo>.. .</bdo> 标签用于文本方向的展示。
示例
<!DOCTYPE html>
<html>
<head>
<title>文本方向的例子</title>
</head>
<body>
<p>该文本将从左到右排列。</p>
<p><bdo dir = "rtl">该文本将从右向左显示。</bdo></p>
</body>
</html>
特殊术语<dfn>...</dfn>
<dfn>...</dfn> 元素(或 HTML 定义元素)允许您指定要引入特殊术语。它的用法类似于段落中间的斜体单词。
通常,您在第一次引入关键术语时会使用 <dfn> 元素。最新的浏览器以斜体字体呈现 <dfn> 元素的内容。
示例
<!DOCTYPE html>
<html>
<head>
<title>特殊术语例子</title>
</head>
<body>
<p>以下是一个<dfn>特殊</dfn>术语。</p>
</body>
</html>
引用文本<blockquote>...</blockquote>
当您想要引用其他来源的段落时,应将其放在 <blockquote>...</blockquote> 标记之间。
<blockquote> 元素内的文本通常从周围文本的左右边缘,有时使用斜体字体。
示例
<!DOCTYPE html>
<html>
<head>
<title>引用文本的例子</title>
</head>
<body>
<p>以下 XHTML 描述取自 W3C 网站:</p>
<blockquote>XHTML 1.0 是 W3C 的第一个 XHTML 推荐标准,随后是
来自 HTML 4.01、HTML 4.0、HTML 3.2 和 HTML 2.0 的早期工作。</blockquote>
</body>
</html>
双引号<q>...</q>
当您想在句子中添加双引号时,可以使用 <q>...</q> 标签。
示例
<!DOCTYPE html>
<html>
<head>
<title>双引号示例</title>
</head>
<body>
<p>测试html双引号例子,<q>吃了吗?</q>。</p>
</body>
</html>
文本引用<cite>...</cite>
如果您引用文本,您可以在<cite>...</cite> 标记之间指明来源,<cite> 元素的内容默认以斜体文本呈现。
示例
<!DOCTYPE html>
<html>
<head>
<title>文本引用例子</title>
</head>
<body>
<p>本 HTML 教程源自 <cite>HTML 的 W3 标准</cite>。</p>
</body>
</html>
编程代码<code>...</code>
出现在网页上的任何编程代码都应放置在 <code>...</code> 标记内。通常,<code> 元素的内容以等宽字体呈现,就像大多数编程书籍中的代码一样。
示例
<!DOCTYPE html>
<html>
<head>
<title>编程代码例子</title>
</head>
<body>
<p>常规文本。 <code>这是代码。</code>常规文本。</p>
</body>
</html>
输入文本
当您谈论计算机时,如果您想告诉读者输入一些文本,您可以使用 <kbd>...</kbd> 元素来指示应该输入什么内容输入,如本例所示。
示例
<!DOCTYPE html>
<html>
<head>
<title>输入文本例子</title>
</head>
<body>
<p>常规文本。 <kbd>这是 kbd 元素内部</kbd> 常规文本。</p>
</body>
</html>
编程变量
此元素通常与 <pre> 和 <code> 元素结合使用,以指示该元素的内容是变量。
示例
<!DOCTYPE html>
<html>
<head>
<title>变量文本例子</title>
</head>
<body>
<p><code>document.write("<var>user-name</var>")</code></p>
</body>
</html>
程序输出
<samp>...</samp> 元素表示程序和脚本等的示例输出。同样,它主要用于记录编程或编码概念时使用
示例
<!DOCTYPE html>
<html>
<head>
<title>程序输出例子</title>
</head>
<body>
<p>程序产生的结果是<samp>Hello World!</samp></p>
</body>
</html>
地址文本<address>...</ address>
<address>...</ address> 元素用于包含任何地址。
示例
<!DOCTYPE html>
<html>
<head>
<title>地址标签例子</title>
</head>
<body>
<address>湖北省武汉xxx街道xx单位xx房号</address>
</body>
</html>