<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>HTML文本格式化实例</title>
</head>
<body>
<!*************************************************
HTML文本格式化实例
***************************************************>
<!*************************************************
文本格式化标签
***************************************************>
<br/><b>******文本格式化标签*******</b><br/>
<b>粗体文本</b><br/>
<big>大号字</big><br/>
<em>着重文字</em><br/>
<i>斜体文字</i><br/>
<small>小号字</small><br/>
<strong>加重语气</strong><br/>
<sub>下标字</sub><br/>
<sup>上标字</sup><br/>
<ins>插入字</ins><br/>
<del>删除字</del><br/>
<!*************************************************
“计算机输出”标签
***************************************************>
<br/><b>******“计算机输出”标签*******</b><br/>
<code>定义计算机代码</code><br/>
<kbd>定义键盘码</kbd><br/>
<samp>定义计算机代码样本</samp><br/>
<tt>定义打字机代码</tt><br/>
<var>定义变量</var><br/>
<pre>定义预格式文本</pre><br/>
<!*************************************************
引用、引用和术语定义
***************************************************>
<br/><b>******引用、引用和术语定义*******</b><br/>
<abbr>定义缩写</abbr><br/>
<acronym>定义首字母缩写</acronym><br/>
<address>定义地址</address><br/>
<bdo dir="rtl">定义文字方向</bdo><br/>
<blockquote>定义长的引用</blockquote><br/>
<q>定义短的引用</q><br/>
<cite>定义引用、引证</cite><br/>
<dfn>定义一个定义项目</dfn><br/>
<!*************************************************
文本的格式化
此例演示如何在一个 HTML 文件中对文本进行格式化
***************************************************>
<br/><b>******文本的格式化*******</b><br/>
<strong>粗体</strong>
<br/>
<big>大big</big>
<br/>
<em>empahsized</em>
<br/>
<i>italic</i>
<br/>
<small>small</small>
<br/>
this text contains
<br/>
<sup>superscript</sup>
<!*************************************************
预格式文本
此例演示如何使用 pre 标签对空行和空格进行控制。
***************************************************>
<br/><b>******预格式文本*******</b><br/>
<pre>
这个是预格式文本
它保留了 空格
和换行。
</pre>
<p>预格式文本很适合显示计算机代码：</p>
<pre>
for i = 1 to 10
print i
next i
</pre>
<!*************************************************
"计算机输出"标签
此例演示不同的“计算机输出”标签的显示效果
***************************************************>
<br/><b>******"计算机输出"标签*******</b><br/>
<code>Computer code</code>
<br/>
<kbd>KeyBoard input</kbd>
<br/>
<tt>Teletype text</tt>
<br/>
<samp>Sample text</samp>
<br/>
<var>Computer variable</var>
<br/>
<p>
<b>注释：</b>这些标签常用于显示计算机/编程代码。
</p>
<!*************************************************
地址
此例演示如何在HTML文件中写地址
***************************************************>
<br/><b>******地址*******</b><br/>
<address>
Written by <a href="243097674@qq.com">AnchoriteFiliGod</a>
<br/>
Visit us at:<br/>
Example.com<br/>
Box 564,DisNeyland<br/>
USA
</address>
<!*************************************************
缩写和首字母缩写
此例演示如何实现缩写和首字母缩写
***************************************************>
<br/><b>******缩写和首字母缩写*******</b><br/>
<abbr title="etcetera">etc.</abbr>
<br/>
<acronym title="World Wide Web">WWW</acronym>
<p>在某些浏览器中，当把鼠标移至缩略词语上时，title可用于展示表达的完整版本.</p>
<p>仅对于IE5中的acronym元素有效。</p>
<p>对于Netscape 6.2中的abbr和acronym元素都有效。</p>
<!*************************************************
文字方向
此例演示如何改变文字的方向
***************************************************>
<br/><b>******文字方向*******</b><br/>
<p>
如果您的浏览器支持 bi-directional override (bdo)，下一行会从右向左输出 (rtl)；
</p>
<bdo dir="rtl">
向右输出测试
</bdo>
<!*************************************************
块引用
此例演示如何实现长短不一的引用语
***************************************************>
<br/><b>******块引用*******</b><br/>
这是长引用：
<blockquote>
这是长引用。这是长引用。这是长引用。这是长引用。这是长引用。这是长引用。这是长引用。这是长引用。这是长引用。这是长引用。这是长引用。这是长引用。这是长引用。这是长引用。
</blockquote>
这是短引用：
<q>
这是短引用。
</q>
<p>
使用blockquote元素的话，浏览器会插入换行和外边距，而q元素不会有任何特殊的呈现。
</p>
<!*************************************************
删除字效果和插入字效果
此例演示如何标记删除文本和插入文本
***************************************************>
<br/><b>******删除字效果和插入字效果*******</b><br/>
<p>一打有<del>二十</del> <ins>十二</ins>件。</p>
<p>大多数浏览器会删除文本和下划线文本。</p>
<p>一些老师的浏览器会把删除文本和下划线文本显示为普通文本。</p>
</body>
</html>
