上机指导
网页的文字和图片是设计网页的基础。本章介绍了网页文字和图片的常用语法，并结合实例介绍网页文字和图片的使用方法。本节将通过上机操作，巩固本章所学的知识点。
实验一
实验内容
练习使用<FONT>元素来设置文字的大小、颜色和字体。
实验目的
巩固知识点——充分发挥<FONT>元素的功能，设置段落文字的大小为3、颜色为蓝色、字体为华文彩云。
实现思路
使用<FONT>元素设置网页文字，并使用<FONT>元素的SIZE属性、FACE属性、COLOR属性来设置文字的大小、字体和颜色。
在Dreamweaver中选择“新建”|“HTML”命令，新建HTML文档。在HTML文档中输入的关键代码如下。
<FONT SIZE="3" COLOR="Blue" FACE=" 华文彩云">
这是字体大小为 3、颜色为蓝色、字体为华文彩云的文字
</FONT>
在菜单栏中选择“文件”|“保存”命令，输入保存路径，单击“保存”按钮，即可完成网页文字的设置。运行页面查看效果如图2.20所示。
图2.20 设置文字样式效果
实验二
实验内容
练习使用与文字排版相关的元素来设置段落文字的样式。
实验目的
巩固知识点——充分发挥与文字排版相关元素的功能，设置文字居中显示、预定义格式和添加水平分隔线。
实现思路
使用与文字排版相关的元素来设置网页文字的段落，并使用<CENTER>元素、<PRE>元素和<HR>元素来设置两段文字居中显示、预定义格式和添加水平分隔线。
在Dreamweaver中选择“新建”|“HTML”命令，新建HTML文档。在HTML文档中输入的关键代码如下。
<CENTER>
<PRE>
春 晓
春眠不觉晓，处处闻啼鸟。
夜来风雨声，花落知多少。
</PRE>
<HR>
<PRE>
春 晓
春眠不觉晓，处处闻啼鸟。
夜来风雨声，花落知多少。
</PRE>
</CENTER>
在菜单栏中选择“文件”|“保存”命令，输入保存路径，单击“保存”按钮，即可完成网页段落文字的设置。运行页面查看效果如图2.21所示。
图2.21 设置文字段落样式效果
实验三
实验内容
练习使用<BODY>元素中的BACKGROUND属性来设置网页的背景图像。
实验目的
巩固知识点——在网页中设置背景图片，并在背景图片上再插入一张图片。
实现思路
使用<BODY>元素中的BACKGROUND属性来设置网页的背景图片，并使用<IMG>元素在网页中插入一张宽为200像素、高为200像素的图片。
在Dreamweaver中选择“新建”|“HTML”命令，新建HTML文档。在HTML文档中输入的关键代码如下。
<BODY BACKGROUND="2.4.jpg">
<P>
插入的图片：<BR>
<IMG SRC="2.1.jpg" WIDTH="200" HEIGHT="200">
</P>
</BODY>
在菜单栏中选择“文件”|“保存”命令，输入保存路径，单击“保存”按钮，即可完成背景图片的设置。运行页面查看效果如图2.22所示。
图2.22 设置背景图片的效果