实例5 新世纪海湾网页（一）

实例说明 在本实例和实例6中将指导读者制作一个新世纪海湾网页，该网页使用了大量的文本信息，为了使网页更美观，在本实例中将设置默认字体的基本属性。通过本实例的学习，使读者掌握页面属性中标题的设置方法。

技术要点 在本实例中，首先导入背景图像，然后置入文本的属性，完成该网页的制作。图5-1所示为本实例完成后的效果。

图5-1 网页背景

1 将本书附带光盘中的“网页基础设置/实例5~6：新世纪海湾网页”文件夹复制到本地站点路径内。

2 运行Dreamweaver CS4，打开复制的“实例5~6：新世纪海湾网页”文件夹中的“新世纪海湾网页源文件．html”，如图5-2所示，将该文件另存在本地站点路径内，然后将其命名为“新世纪海湾网页”。

图5-2 打开“新世纪海湾网页源文件．html”

3 插入背景图像。在第一行单元格内单击，执行菜单栏内的“插入”/“图像”命令，打开“选择图像源文件”对话框，从该对话框中选择复制的“实例5~6：新世纪海湾网页”文件夹中的material.jpg文件，如图5-3所示，单击“确定”按钮，退出该对话框。

图5-3 “选择图像源文件”对话框

4 单击“属性”面板中的“页面属性”按钮，打开“页面属性”对话框，在“分类”显示窗中选择“标题（CSS）”选项，在“页面属性”对话框中会显示“标题（CSS）”编辑窗，选择“标题字体”下拉选项栏中的“编辑字体列表”选项，如图5-4所示。

图5-4 “页面属性”对话框

5 选择“编辑字体列表”选项后，打开“编辑字体列表”对话框，在“可用字体”下拉选项栏中选择“方正北魏楷书繁体”选项，如图5-5所示。然后单击该对话框中的按钮，加载字体样式，单击“确定”按钮，退出该对话框。

图5-5 “编辑字体列表”对话框

6 退出“编辑字体列表”对话框后，再次在“页面属性”对话框中的“标题字体”下拉选项栏中选择“方正北魏楷书繁体”选项，设置标题字体样式，如图5-6所示。

图5-6 “页面属性”对话框

7 在“页面属性”对话框中的“标题1”参数栏中键入60，设置字体大小，将其右侧颜色显示窗中的颜色设置为黄色（#FF9），设置字体颜色，如图5-7所示。

图5-7 “页面属性”对话框

8 使用同样的方法，在“标题2”参数栏中键入20，将其右侧颜色显示窗中的颜色设置为粉红色（#EDB4D9）；在“标题3”参数栏中键入20，将其右侧颜色显示窗中的颜色设置为黑色，如图5-8所示。

图5-8 “页面属性”对话框

9 现在本实例就制作完成了，图5-9所示为本实例完成后的效果。保存本实例，以便在实例6中使用。

图5-9 网页背景