HTML 文本格式化
HTML提供了几个标签,我们可以使用web页面上做一些文本出现不同于正常的文本。
粗体文本
<b>…</b>
元素中出现的任何内容都将以粗体显示:
<p>文本文本<b>粗体文本</b>文本</p> <p>文本文本<strong>粗体文本</strong>文本</p>
HTML中<strong>
和<b>
标签的区别
<strong>
和<b>
标签默认以粗体显示所包含的文本,
但<strong>
标签表明其内容非常重要,
而<b>
标签只是用来吸引读者的注意,而不传达任何特殊的重要性。
斜体文本
在<i>…</i>
元素中出现的任何内容都以斜体显示,如下所示
<p>普通文本<i>斜体文本</i> 普通文本内容</p>
HTML中<em>
和<i>
标签的区别
<em>
和<i>
标签文本在默认情况下都显示为斜体。
但<em>
标记强调与周围文本相比,表明其内容强调。
而<i>
标记用于标记文本从正常的文本可读性的原因,比如这是一个技术术语,这是另一种语言的习语等。
下划线文本
在<u>…</u>
元素中出现的任何内容都将以下划线显示,如下所示
<p>下面的单词使用<u>带下划线</u> 的样式。</p>
删除文本
在<strike>…</strike>
元素中出现的任何内容都将用删除线显示,这是贯穿文本的一条细线,如下所示:
<p>下面的文本使用<strike>删除线</strike> 的样式。</p>
等宽字体
<tt>…</tt>
元素的内容以等宽字体书写。
大多数字体被称为可变宽度字体,因为不同的字母具有不同的宽度(例如,字母“m”比字母“i”宽)。
然而,在等宽字体中,每个字母的宽度相同。
<p>下面使用的是<tt>等宽字体min</tt></p>
上标文本
<sup>…</sup>
元素的内容是用上标写的;使用的字体大小与它周围的字符大小相同,但在其他字符上方显示半个字符的高度。
<p>右边的是<sup>上标12</sup>,其他文本</p>
下标文本
<sub>…</sub>
元素的内容是用下标编写的;使用的字体大小与它周围的字符相同,但在其他字符下面显示半个字符的高度。
<p>这是<sub>下标</sub>文本</p>
插入文本
在<ins>…</ins>
元素中出现的任何内容都将显示为插入的文本。
<p>这是<del>删除文本</del> 这是<ins>插入文本</ins></p>
删除文本
在<del>…</del>
元素中出现的任何内容都将显示为已删除的文本。
<p>这是<del>删除文本</del> 这是<ins>插入文本</ins></p>
big文本
<big>…</big>
元素的内容显示为比周围其他文本大一个字体,如下所示:
<p>下面的文本是<big>big</big>样式,即字体大一号</p>
small文本
<small>…</small>
元素的内容显示为比其周围其他文本小一个字体大小,如下所示:
<p>下面的文字是小一号字体<small>我是小号字体</small></p>
分组内容
<div>和<span>
元素允许我们将多个元素组合在一起,以创建页面的部分或子部分。
例如,我们可能希望将所有脚注放在<div>
元素中的页面上,以指示该<div>
元素中的所有元素都与脚注相关。然后我们可以将一个样式添加到这个<div>
元素,以便使用一组特殊的样式规则来显示它们。
<div id = "menu" align = "middle" > <a href = "/index.htm">首页</a> | <a href = "/about/contact_us.htm">联系我们</a> | <a href = "/about/index.htm">关于我们</a> </div> <div id = "content" align = "left" bgcolor = "white"> <h5>标题</h5> <p>内容</p> </div>
另一方面,<span>
元素只能用于分组内联元素。因此,如果你想把句子或段落的某一部分组合在一起,你可以使用下面的<span>
元素。
<p><span style = "color:green">span标签</span>示例 <span style = "color:red">span属于内联元素</span></p>
这些标记通常与CSS一起使用,允许我们将样式添加到页面的某个部分。
格式化引文
我们可以使用HTML <blockquote>
标签轻松格式化来自其他来源的引用块。
Blockquotes通常显示为左右缩进的页边距,并在上面和下面增加一些额外的空间。
<blockquote> <p>今天很残酷明天很残酷后天很美好</p> <cite>—马云</cite> </blockquote>
“引用”标签用于描述一项创造性的工作。通常包括该作品的标题或作者的名字。
对于简短的内联引号,可以使用HTML <q>
标记。 大多数浏览器通过在文本周围加上引号来显示内联引号。
<p>高尔基:<q>书是人类进步的阶梯</q></p>
显示缩写
缩写是一个单词、短语或名字的缩写形式。
可以使用<abbr>
标记表示缩写。
在此标记中使用title属性来提供缩写的完整扩展,当鼠标光标悬停在元素上时,浏览器将以工具提示的形式显示该缩写。
<p>The <abbr title="Hypertext Markup Language">HTML</abbr> 是设计用于在web浏览器中显示的文档的标准标记语言。</p>