上一章HTML教程请查看:html格式化
短语标签已经为特定的目的进行了干燥,尽管它们的显示方式与其他基本标签类似,如<
b>
、<
i>
、<
pre>
和<
tt>
,你在前一章已经看到。这一章将带你浏览所有重要的短语标签,所以让我们开始一个一个地看它们。
强调文本任何出现在<
em>
…<
/em>
元素显示为强调的文本。
例子
<
!DOCTYPE html>
<
html><
head>
<
title>强调文本的例子<
/title>
<
/head><
body>
<
p>以下单词使用<
em>强调<
/em>字体。<
/p>
<
/body><
/html>
标记文本任何出现在< mark> … < /mark> 元素,用黄色标记显示。
例子
<
!DOCTYPE html>
<
html><
head>
<
title>标记文本的例子<
/title>
<
/head><
body>
<
p>以下单词已被标记为<
mark>标记为黄色<
/mark><
/p>
<
/body><
/html>
加强文本任何出现在< strong> … < /strong> 元素显示为加强文本。
例子
<
!DOCTYPE html>
<
html><
head>
<
title>加强文本示例<
/title>
<
/head><
body>
<
p>The following word uses a <
strong>strong<
/strong> typeface.<
/p>
<
/body><
/html>
文字缩写你可以将文本缩写为打开< abbr> 和关闭< /abbr> 标记,如果存在,title属性必须包含完整的描述,而不能包含其他内容。
例子
<
!DOCTYPE html>
<
html><
head>
<
title>文字缩写<
/title>
<
/head><
body>
<
p>这是<
abbr title = "Abhishek">Abcd<
/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> 元素表示双向覆盖,用于覆盖当前文本方向。
例子
<
!DOCTYPE html>
<
html><
head>
<
title>文字方向的例子<
/title>
<
/head><
body>
<
p>这篇文章将从左到右。<
/p>
<
p><
bdo dir = "rtl">这篇文章将从右向左。<
/bdo><
/p>
<
/body><
/html>
特别术语< dfn > …< /dfn> 元素(或HTML定义元素)允许你指定要引入的特殊术语,它的用法类似于段落中间的斜体词。
通常,在第一次引入关键字时,你将使用< dfn> 元素,最新的浏览器以斜体显示< dfn> 元素的内容。
例子
<
!DOCTYPE html>
<
html><
head>
<
title>特殊术语例子<
/title>
<
/head><
body>
<
p>这是一个 <
dfn>特殊术语<
/dfn> 的例子.<
/p>
<
/body><
/html>
引用文本当你想引用另一个来源的文章时,你应该把它放在< blockquote> …< / blockquote > 标签。
< blockquote> 元素内的文本通常由周围文本的左右边缘缩进,有时使用斜体字体。
例子
<
!DOCTYPE html>
<
html><
head>
<
title>引用例子<
/title>
<
/head><
body>
<
p>以下关于XHTML的描述摘自W3C网站:<
/p><
blockquote>XHTML 1.0 is the W3C's first Recommendation for XHTML,following on
from earlier work on HTML 4.01, HTML 4.0, HTML 3.2 and HTML 2.0.<
/blockquote>
<
/body><
/html>
双引号< q> … < /q> 元素用于在一个句子中添加双引号。
例子
<
!DOCTYPE html>
<
html><
head>
<
title>双引号例子<
/title>
<
/head><
body>
<
p>I like Decartes, <
q>I think Therefore I am<
/q>.<
/p>
<
/body><
/html>
文本引用如果要引用文本,可以将其置于开始的< cite> 标记和结束的< /cite> 标记之间
正如你在打印出版物中所期望的那样,< cite> 元素的内容在缺省情况下以斜体文本呈现。
例子
<
!DOCTYPE html>
<
html><
head>
<
title>引用的例子<
/title>
<
/head><
body>
<
p>本HTML教程源自<
cite>W3 HTML标准<
/cite>.<
/p>
<
/body><
/html>
编程代码任何出现在网页上的编程代码都应该放在< 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> 元素用于包含任何地址。
【html短语标签 – HTML教程】例子
<
!DOCTYPE html>
<
html><
head>
<
title>地址示例<
/title>
<
/head><
body>
<
address>18A, Road No 69, A - B<
/address>
<
/body><
/html>
推荐阅读
- html meta元标签 – HTML教程
- html格式化 – HTML教程
- html属性 – HTML教程
- html元素 – HTML教程
- html基本标签 – HTML教程
- html基本概念和入门开发 – HTML教程
- ColorUi|使用ColorUI构建小程序项目
- 构建自定义模块 — Quill富文本编辑器快速入门中文文档
- 将Quill添加到项目构建管道中 — Quill富文本编辑器快速入门中文文档