2.1 文字格式
文字格式主要是用一些HTML元素来标记文本的方式，用来更改文字的大小、字体、颜色等属性，还能为文本增加如粗体、斜体、上标、下标等修饰效果。
2.1.1 设置文字大小
在HTML中，<FONT>元素可以用来显示文字的属性，包括文字的大小、颜色、字体等。其中设置文字大小的属性为SIZE，其语法格式如下。
<FONT SIZE="n">文字</FONT>
其中n的有效范围是数字1～7。
【示例2-1】请看下面的例子，注意加粗的代码。
01 <HTML> 02 <HEAD> 03 <TITLE>文字大小</TITLE> 04 </HEAD> 05 <BODY> 06 这是默认的文字大小<BR> 07 <FONT SIZE="1">1号字体大小</FONT><BR> 08 <FONT SIZE="2">2号字体大小</FONT><BR> 09 <FONT SIZE="3">3号字体大小</FONT><BR> 10 <FONT SIZE="4">4号字体大小</FONT><BR> 11 <FONT SIZE="5">5号字体大小</FONT><BR> 12 <FONT SIZE="6">6号字体大小</FONT><BR> 13 <FONT SIZE="7">7号字体大小</FONT><BR> 14 </BODY> 15 </HTML>
第7～13行分别为文字内容设置字号为1～7号。
示例2-1运行效果如图2.1所示。从图2.1中可以看出，SIZE属性的值越大，在浏览器中显示出来的文字就越大。当然，SIZE属性的值不可能无限大，其有限范围为1～7。如果大于7，则显示的文字大小与SIZE等于7的文字大小相同；如果小于1，则显示的文字大小与SIZE等于1的文字大小相同。
图2.1 设置文字大小运行效果
2.1.2 设置字体
文字可以设置多种字体，中文的有宋体、仿宋、黑体等，英文字体有Arial、Times New Roman等，为了保证网页的通用性，HTML的早期版本是不允许为文字指定字体的，从HTML 3.2版本开始，可以为网页中的文字指定不同的字体，使网页的表现形式更为丰富。
1. 设置网页字体
设置文字字体使用<FONT>标签的FACE属性，其语法格式如下。
<FONT FACE="字体名称">文字</FONT>
其中FACE属性值为字体的名称。要想知道自己计算机中安装了什么字体，可以在操作系统所在盘的Windows\Fonts目录下看到，如图2.2所示，在“预览、删除或者显示和隐藏计算机上安装的字体”栏下的都是可用的字体。
图2.2 计算机上安装的字体
【示例2-2】设置字体，注意加粗的代码。
01 <HTML> 02 <HEAD> 03 <TITLE>设置字体</TITLE> 04 </HEAD> 05 <BODY> 06 这是默认的字体<BR> 07 <FONT FACE="宋体">这是字体名为“宋体”的文字</FONT><BR> 08 <FONT FACE="黑体">这是字体名为“黑体”的文字</FONT><BR> 09 <FONT FACE="仿宋">这是字体名为“仿宋”的文字</FONT><BR> 10 <FONT FACE="楷体">这是字体名为“楷体”的文字</FONT><BR> 11 <FONT FACE="隶书">这是字体名为“隶书”的文字</FONT><BR> 12 <FONT FACE="华文行楷">这是字体名为“华文行楷”的文字</FONT><BR> 13 <FONT FACE="Arial">Arial</FONT><BR> 14 <FONT FACE="Freestyle Script">Freestyle Script</FONT><BR> 15 <FONT FACE="Harlow Solid Italic">Harlow Solid Italic</FONT><BR> 16 下面是一些好玩的字体：<BR> 17 <FONT FACE="Wingdings 1">Wingdings 1</FONT><BR> 18 <FONT FACE="Wingdings 2">Wingdings 2</FONT><BR> 19 <FONT FACE="Wingdings 2">Wingdings 3</FONT><BR> 20 </BODY> 21 </HTML>
第6～19行，使用<FONT>标记的FACE属性来为文字设置不同的字体，其中第6行为默认字体，其他各行分别采用不同的字体来显示文字内容。
示例2-2运行效果如图2.3所示。从图2.3中可以看出，为FONT元素指定不同的FACE属性值之后，在浏览器中可以显示不同的字体。
图2.3 设置字体运行效果
2. 设置浏览器默认字体
需要注意的是，在示例2-2中显示的字体在设计者的计算机上可以正常浏览，但是换成在用户的计算机上就不一定可以正常浏览了。例如，在该文件中指定了“华文行楷”字体，如果读者的计算机中没有安装这种字体，浏览器就会用默认的字体来显示这种字体。
在Internet Explorer浏览器中设置默认字体的方法如下。
（1）启动Internet Explorer浏览器，单击菜单栏中的“工具”|“Internet选项”命令，弹出图2.4所示的“Internet选项”对话框。
图2.4 “Internet选项”对话框
（2）选择“常规”选项卡，然后单击“字体”按钮。
（3）弹出图2.5所示的“字体”对话框，在该对话框中可以设置浏览器的默认字体。
图2.5 “字体”对话框
注意
因为无法确认访问网页的浏览者的计算机里都会安装什么字体，所以在设计网页时，最好不要使用不常用的字体，尽量指定宋体、楷体等一般计算机都会默认安装的字体。
2.1.3 设置字体颜色
如果没有设置网页文字字体的颜色，那么这个网页就是黑白的，失去了其缤纷的色彩。使用<FONT>元素的COLOR属性可以为文字设置不同的颜色，其语法格式如下。
<FONT COLOR="颜色">文字</FONT>
颜色可以有两种表示方法：颜色名称与RGB颜色数值。颜色名称就是类似RED、BLUE等颜色的英文名。RGB颜色是由红色、绿色、蓝色的组合来指定的一种颜色，任何一种颜色都可以用0～255的一个数值表示，但必须使用十六进制的数字来表示这些组合。例如，一种颜色的RGB代码为“#FFC0CB”，就代表是用强度为FF（也就是255）的红色、强度为C0的绿色与强度为CB的蓝色混合成的颜色，也就是粉红色。
注意
使用RGB颜色，必须在十六进制组合前加上“#”字符。
几乎所有浏览器都能识别以下16种预定义的颜色：Red（红色）、Yellow（黄色）、Blue（蓝色）、Navy（深蓝色）、Green（绿色）、Lime（浅绿色）、Aqua（碧绿色）、Olive（橄榄绿）、Black（黑色）、Gray（灰色）、Silver（银色）、Maroon（栗色）、Purple（紫色）、Fuchsia（紫红色）、Teal（深青色）和White（白色）。而Internet Explorer浏览器可以识别更多的颜色单词，表2.1列出了Internet Explorer浏览器能识别的颜色单词。
表2.1 Internet Explorer浏览器能识别的颜色单词
【示例2-3】设置文字字体颜色。
01 <HTML> 02 <HEAD> 03 <TITLE>设置文字颜色</TITLE> 04 </HEAD> 05 <BODY> 06 以下是预定义的十六种颜色：<BR> 07 <TABLE WIDTH="100%"> 08 <TR> 09 <TD ALIGN="CENTER"> <FONT COLOR="Red">Red ：红色</FONT></TD> 10 <TD ALIGN="CENTER"> <FONT COLOR="Yellow">Yellow：黄色</FONT></TD> 11 <TD ALIGN="CENTER"> <FONT COLOR="Blue">Blue ：蓝色</FONT></TD> 12 <TD ALIGN="CENTER"> <FONT COLOR="Navy">Navy ：深蓝色</FONT></TD> 13 </TR> 14 <TR> 15 <TD ALIGN="CENTER"> <FONT COLOR="Green">Green：绿色</FONT></TD> 16 <TD ALIGN="CENTER"> <FONT COLOR="Lime">Lime ：浅绿色</FONT></TD> 17 <TD ALIGN="CENTER"> <FONT COLOR="Aqua">Aqua ：碧绿色</FONT></TD> 18 <TD ALIGN="CENTER"> <FONT COLOR="Olive">Olive：橄榄绿</FONT></TD> 19 </TR> 20 <TR> 21 <TD ALIGN="CENTER"> <FONT COLOR="Black">Black：黑色</FONT></TD> 22 <TD ALIGN="CENTER"> <FONT COLOR="Gray">Gray ：灰色</FONT></TD> 23 <TD ALIGN="CENTER"> <FONT COLOR="Silver">Silver：银色</FONT></TD> 24 <TD ALIGN="CENTER"> <FONT COLOR="Maroon">Maroon：栗色</FONT></TD> 25 </TR> 26 <TR> 27 <TD ALIGN="CENTER"> <FONT COLOR="Purple">Purple：紫色</FONT></TD> 28 <TD ALIGN="CENTER"> <FONT COLOR="Fuchsia">Fuchsia：紫红色</FONT></TD> 29 <TD ALIGN="CENTER"> <FONT COLOR="Teal">Teal ：深青色</FONT></TD> 30 <TD ALIGN="CENTER" BGCOLOR="Black"><FONT COLOR="White">White ：白色 </FONT></TD> 31 </TR> 32 </TABLE> 33 以下是使用的是 RGB 颜色： 34 <TABLE WIDTH="100%"> 35 <TR> 36 <TD ALIGN="CENTER"> <FONT COLOR="#8A2BE2">8A2BE2</FONT></TD> 37 <TD ALIGN="CENTER"> <FONT COLOR="#7FFF00">7FFF00</FONT></TD> 38 <TD ALIGN="CENTER"> <FONT COLOR="#008B8B">008B8B</FONT></TD> 39 <TD ALIGN="CENTER"> <FONT COLOR="#BDB76B">BDB76B</FONT></TD> 40 </TR> 41 </TABLE> 42 </BODY> 43 </HTML>
第7～39行在表格中显示不同颜色的文字内容，其中使用了3FONT标记的COLOR属性。示例2-3运行结果如图2.6所示。
图2.6 设置字体颜色运行结果
注意
虽然可以用颜色名称来代替RGB颜色，但是并不是所有的浏览器都可以识别这些英文名称，因此还是建议使用RGB颜色值。
2.1.4 加粗与斜体
通常在处理文字时，都会对比较重要的内容使用加粗、斜体来引起读者的注意。在网页上同样可以使用加粗与斜体来达到相同的效果。
在HTML元素中，可以用<B>元素来加粗文字，用<I>元素来使文字倾斜。除了<B>元素与<I>元素之外，还可以使用<STRONG>元素来加粗文字，使用<EM>元素来使文字倾斜。设置加粗与斜体的语法格式如下。
<B>加粗的文字</B> <I>倾斜的文字</I> <STRONG>加粗的文字</STRONG> <EM>倾斜的文字</EM>
【示例2-4】设置文字为加粗和斜体。
01 <HTML> 02 <HEAD> 03 <TITLE>粗体与斜体</TITLE> 04 </HEAD> 05 <BODY> 06 <FONT SIZE=4> 07 这是四号文字大小<BR> 08 <B> 这是使用B 元素加粗的四号文字</B><BR> 09 <I>这是使用I 元素倾斜的四号文字</I><BR> 10 <STRONG>这是使用STRONG 元素加粗的四号文字</STRONG><BR> 11 <EM>这是使用EM元素倾斜的四号文字</EM><BR> 12 <BIG>这是加大的四号文字</BIG><BR> 13 </FONT> 14 </BODY> 15 </HTML>
第8～12行分别采用特殊标记来使字体显示相应的特殊效果，如加粗、斜体等。示例2-4的运行效果如图2.7所示。从图2.7中可以看出，使用<STRONG>元素与<B>元素加粗文字没有什么区别，使用<EM>元素与<I>元素使文字倾斜也没有什么区别。
图2.7 加粗与斜体运行结果
注意
B元素与BIG元素的区别是：BIG元素是将文字加大，并不变粗；而B元素只是让文字变粗，并不加大。
2.1.5 下画线与删除线
有些时候希望文字带下画线显示，例如可以使用下画线元素突出显示某些说明文字。删除线一般在修改文章时常常用到，表示原来的这部分文字被删除了。
1. 被反对使用的元素
在HTML的早期版本中，使用<STRIKE>元素来标注带有删除线的文字，使用<U>元素来标注带有下画线的文字。不过<STRIKE>元素与<U>元素都是在HTML 4以上版本中被反对的元素。所谓“被反对”，是指不希望再使用的元素，被反对的原因在后继章节里还会介绍。
虽然<STRIKE>元素与<U>元素是被反对的元素，但是大多浏览器还是支持该元素，而且笔者相信在将来很长一段时间里，浏览器也不会取消对这些反对元素的支持，因此读者可以放心地使用这些元素。
2. 被赞成使用的元素
从HTML 4.0版本开始，正式使用了两个新元素：<DEL>元素（删除线）和<INS>元素（插入线），用来替代<STRIKE>元素与<U>元素，不过它们在浏览器中的显示效果都是一样的。
删除线与下画线元素的语法格式如下。
<STRIKE>删除线</STRIKE> <U>下画线</U> <DEL>删除线</DEL> <INS>插入线</INS>
【示例2-5】设置删除线和下画线，注意加粗的代码。
01 <HTML> 02 <HEAD> 03 <TITLE>删除线与下画线</TITLE> 04 </HEAD> 05 <BODY> 06 <STRIKE> 删除线</STRIKE><BR> 07 <U>下画线</U><BR> 08 <DEL>删除线</DEL><BR> 09 <INS>插入线</INS><BR> 10 </BODY> 11 </HTML>
第6～9行分别演示了两种不同的下画线与删除线标记的使用。示例2-5的运行效果如图2.8所示。
图2.8 使用删除线和下画线运行效果
注意
<STRIKE></STRIKE>标记可以简写为<S></S>。
2.1.6 上标与下标
在描述一些复杂的表达式，特别是一些数学公式时，经常会用到上标和下标，如3的平方（32）。在HTML页面中，上标采用<SUB>元素，下标采用<SUP>元素。其语法格式如下。
<SUB>作为上标的文字</SUB> <SUP>作为下标的文字</SUP>
【示例2-6】设置上标和下标，注意加粗代码。
01 <HTML> 02 <HEAD> 03 <TITLE>上标与下标</TITLE> 04 </HEAD> 05 <BODY> 06 <FONT SIZE=4> 07 水的分子式是：H<SUB>2</SUB>O<BR> 08 3<SUP>2</SUP>等于9 09 </FONT> 10 </BODY> 11 </HTML>
第7行使用<SUB>标记显示下标效果，第8行使用<SUP>标记显示上标效果。示例2-6的运行效果如图2.9所示。
图2.9 使用上标和下标的运行效果
2.1.7 等宽字
等宽字体一般针对的是英文字体，所谓等宽，就是像打字机文本一样的字体，在默认情况下，这种字体是Courier字体。通常只有在显示计算机代码等情况下，才会使用等宽字体。HTML中的<TT>元素可以用来设置等宽字体。使用<TT></TT>标记表明标注的文字为类似打印机文本（typewriter text）使用的等宽字体。TT元素的语法格式如下。
<TT>英文文字</TT>
由于该内容比较简单，使用也很少，在此就不举例了。