HTML学习：文本格式化

HTML 中存在一些格式化文本的标签，它们可以被直接使用，而不用再去写样式进行调整。

一、文本格式化

HTML 使用标签<b>("bold") 与<i>("italic") 对输出的文本进行格式。
通常标签<strong>替换加粗标签<b>来使用，<em>替换<i>标签使用。 然而，这些标签的含义是不同的。 <strong>或者<em>意味着你要呈现的文本是重要的，所以要突出显示。

<h1>标题一</h1>
<hr> <!-- 注释：这是一条水平线 -->
<h2>标题二</h2>
<h3>标题三</h3>
<h4>标题四</h4>
<h5>标题五</h5>
<h6>标题六</h6>
<b>加粗</b>
<br><!-- 注释：换行 -->
<i>斜体</i><br />
<code>电脑自动输出</code><br />
这是<sub>下标</sub>和<sup>上标</sup><br /><br />
<b>这个文本是加粗的</b><br />
<strong>这个文本是加粗的</strong><br />
<big>这个文本字体放大</big><br />
<em>这个文本是斜体的</em><br />
<i>这个文本是斜体的</i><br />
<small>这个文本是缩小的</small><br />
这个文本包含<sub>下标</sub><br />
这个文本包含<sup>上标</sup>

文本格式化.png

二、预格式文本

使用 pre 标签对空行和空格进行控制。

<pre>
    使用 pre 标签
对空行

    和    空格
进行控制
</pre>

预格式文本.png

三、"计算机输出"标签

常用于显示计算机/编程代码。

<code>计算机输出</code><br />
<kbd>键盘输入</kbd><br />
<tt>打字机文本</tt><br />
<samp>计算机代码样本</samp><br />
<var>计算机变量</var><br />

"计算机输出"标签.png

四、地址

在 HTML 文件中写地址。

<address>
Written by <a href="mailto:example@163.com">Example</a><br />
</address>

地址.png

五、缩写和首字母缩写

实现缩写或首字母缩写。
在某些浏览器中，当您把鼠标移至缩略词语上时，title 可用于展示表达的完整版本。
仅对于 IE 5 中的 acronym 元素有效。
对于 Netscape 6.2 中的 abbr 和 acronym 元素都有效。

<abbr title="etcetera">etc.</abbr><br />
<acronym title="World Wide Web">WWW</acronym>

缩写和首字母缩写.png

六、文字方向

改变文字的方向。

<p>该段落文字从左到右显示。</p>
<p><bdo dir="rtl">该段落文字从右到左显示。</bdo></p>

文字方向.png

七、块引用

实现长短不一的引用语。

标签	描述
<abbr>	定义缩写
<address>	定义地址
<bdo>	定义文字方向
<blockquote>	定义长的引用
<q>	定义短的引用语
<cite>	定义引用、引证
<dfn>	定义一个定义项目

<p>块引用：
    <q>引用的文字</q>
。</p>

块引用.png

八、删除字效果和插入字效果

标记删除文本和插入文本。

<p>实例文字<del>删除</del> <ins>插入</ins>!</p>

删除字效果和插入字效果.png