3.2 文字排版
本节介绍HTML网页的文字排版，包括文字的字形和字体、上标、下标等内容。
3.2.1 字形字体
在HTML网页设计中，可以创建出风格多样的字形字体样式，具体是通过设置CSS层叠样式表的font-family属性就可以实现。
下面是一个使用font-family属性设计不同风格字形字体的HTML示例代码（详见源代码ch03/ch03-html-family.html文件）。
【代码3-5】
【代码解析】
第16～18行代码通过<p>标签元素定义了第一个段落。其中，第16行代码通过style属性定义了"font-family: '黑体';"字形字体样式。
第20～22行代码通过<p>标签元素定义了第二个段落。其中，第20行代码通过style属性定义了"font-family: 'Microsoft YaHei';"字形字体样式，该字形与“Serif”和“Sans-serif”一样为通用样式。
第24～26行代码通过<p>标签元素定义了第三个段落。其中，第24行代码通过style属性定义了"font-family: 'Verdana';"字形字体样式。
运行测试网页，效果如图3.5所示。
图3.5 字形字体样式
提示
在网页代码的头部建议将字符编码设置成“utf-8”编码，这样可以避免出现一些不必要的乱码现象。
3.2.2 上、下标字体
在HTML网页文字排版中，上标字体与下标字体也是比较常见的。譬如，在引用文献时上标字体肯定要用到，而定义数理化符号时下标字体也是必不可少的。HTML规范中使用<sup>标签元素表示上标，<sub>标签元素表示下标。
下面是一个设置字体上下标的HTML示例代码（详见源代码ch03/ch03-html-sup-sub.html文件）。
【代码3-6】
【代码解析】
第12行代码使用sup标签元素定义了上标标记【5】，用于表示引用文献的序号。
第16行代码使用sub标签元素定义了下标标记2，用于表示二氧化碳分子符号中氧元素（O）的分子量。
运行测试网页，效果如图3.6所示。
图3.6 上、下标样式