摘要：前言在制作网页时，文字是最基本的元素之一。让阅读者更容易阅读，短时间里获得更多信息，是网页创作者的目标。本篇将介绍各种文字格式标签的使用方法。本
前言
本篇主要针对初学者的一篇教程，如果你非常熟悉html，可以忽略本篇文章。
目录
标题文字文字格式标签段落标签其它标签标题文字
在网上浏览时经常看到一些标题文字，用来对应章节划分，它们以固定的字号显示，总共有6种级别的标题，从 h1 至 h6 依次减小，如下图：
html 代码：
html><html><head><metacharset="utf-8"><title>标题 title > head ><body><h1>这是标题 1 h1 ><h2>这是标题 2 h2 ><h3>这是标题 3 h3 ><h4>这是标题 4 h4 ><h5>这是标题 5 h5 ><h6>这是标题 6 h6 > body > html >标题对齐方式可以使用 align 属性，分别有三个属性：
left —— 左对齐center —— 居中对齐right —— 右对齐如下图：
html代码：
html><html><head><metacharset="utf-8"><title>标题 title > head ><body><h1>这是标题 1 h1 ><h2align="left">这是标题 2 h2 ><h3align="center">这是标题 3 h3 ><h4align="right">这是标题 4 h4 ><h5>这是标题 5 h5 ><h6>这是标题 6 h6 > body > html >文字格式标签
除了标题，网页中普通文字也是不可缺少的，而各种文字效果可以使网页更加漂亮。
只需在和之间输入文字，就会直接在页面中显示，如何设置这些文字的格式，这里使用标签，下面将逐一介绍各种文字格式用法。
一、设置字体、字号、颜色 —— 标签
标签在HTML 4 中用于指定字体、字体大小和文本颜色，但在HTML5 中不支持。
face 属性：字体类型size 属性： 字体字号大小color 属性：字体颜色html代码：
<html><body><div><fontface="宋体">字体 font > div ><div><fontsize="5">5号字体 font > div ><div><fontcolor="red">颜色 font > div ><div><fontsize="5"face="arial"color="blue">一起使用 font > div > body > html >在html5中不建议使用，请用 css 样式代替。
二、粗体、斜体、下划线、删除线—— strong、em、u、del
效果如下：
html代码：
html><html><body><p>这是普通文本 -<strong>这是粗体文本 strong >。 p ><p>这是普通文本 -<em>这是斜体 em >。 p ><p>这是普通文本 -<u>这是下划线 u >。 p ><p>这是普通文本 -<del>这是下划线 del >。 p > body > html >注：html 5 和 html 4 相关标签存在巨大差异，比如 strong 和 b 、del 和 s、em 和 i 等效果相同，在html5 中不支持，b、s、i 标签，已不建议使用，关于各种差异，可自己了解下就可以了。网站SEO
3、上标和下标 —— sup、sub
效果如下：
html代码：
<html><body><p>普通文本<sup>上标 sup > p ><p>普通文本<sub>下标 sub > p ><p>数学公式 X<sup>3 sup >+ 5X<sup>2 sup >- 5 = 0 p ><p>数学公式 X<sub>1 sub >- 2X<sub>1 sub >= 0 p > body > html >4、空格——
一般在网页中输入文字时，在段落中明明增加了空格，却在页面中看不到，这是因为在html中，浏览器本身会将2个句子之间的所有半角空白仅当做一个空白来看待。所以在这里使用空格符代替，每个空格符代表一个半角空格，多个空格可以使用多次。
html代码：
由于头条不显示空格字符，所以用图片代替
效果：
5、其它特殊字符
除了空格字符，在网页中还有一些特殊字符也需要使用代码来代替，一般情况下，特殊字符由前缀&开始、字符名和后缀;组成，和空格符类似。如下表
特殊字符有很多，这里只列出一些例子，具体自己搜索了解下。
段落
在网页中要把文字有条理地显示，需要使用到段落标签，下面介绍一些与段落相关的标签。
段落标签——p在网页中，通过
定义为一个段落。
html代码：
<html><body><p>这是段落。 p ><p>这是段落。 p ><p>这是段落。 p ><p>段落元素由 p 标签定义。 p > body > html >效果：
在写文字时，除了自动换行外，换可以使用标签强制文字换行，这个和 p 段落标签不一样。段落标签的换行是隔行的，而br不是，时2行文字更加紧凑。
html代码：网站SEO
<html><body><p>第一个段落<br/>换行1<br/>换行2<br/>换行3<br/>最后一行. p ><p>第二个段落<br/>换行1<br/>换行2<br/>换行3<br/>最后一行. p > body > html >效果如下：
如果不想文字被浏览器自动换行，可以使用标签处理，如下图：
改行文字不会被自动换行，会看到出现横向滚动条。
在网页制作中，有时需要保留一些特殊的排版效果，这是使用标签控制就会很麻烦，使用标签就可以保留文本的格式排版效果。如下图：
html代码：
<html><body><pre>这是 预格式文本。 它保留了 空格 和换行。 pre ><p>pre 标签很适合显示计算机代码： p ><pre>for i = 1 to 10 print i next i pre ><p>这是一个ok效果 p ><pre>O O k K O O K K O O K K pre > body > html >其它标签
右缩进—— blockquote使用可以实现文字段落缩进，每使用一次，段落就缩进一次，可以嵌套使用。
实例代码：
Here comes alongquotation: Thisisalongquotation. Thisisalongquotation. Thisisalongquotation. Thisisalongquotation. Thisisalongquotation. 请注意，浏览器在 blockquote 元素前后添加了换行，并增加了外边距。效果如下：
请注意，浏览器在 blockquote 元素前后添加了换行，并增加了外边距。
水平线——hr在段落和段落之间加上一行水平线，将段落隔开。如下效果：
html代码：
<html><body><p>hr 标签定义水平线： p ><hr/><p>这是段落。 p ><hr/><p>这是段落。 p ><hr/><p>这是段落。 p > body > html >文字标注——ruby在网页中可以通过添加对文字的标注来说明某段文本。
效果如下：
html代码：
HTML><html><body><p>ruby 使用语法： p ><ruby>被说明的文字<rt>标注 rt > ruby > body > html >其它标签——var、code、kbd等定义一个定义项目。
定义计算机代码文本。
定义样本文本。
定义键盘文本。它表示文本是从键盘上键入的。它经常用在与计算机相关的文档或手册中。
定义变量。您可以将此标签与 及 标签配合使用。
定义引用。可使用该标签对参考文献的引用进行定义，比如书籍或杂志的标题。
总结
最后，感谢您的阅读及关注，祝你学习愉快。
文章优化
