网页制作教案第三章资料.ppt

项目三 设置网页内容 任务一 网页基本设置 任务二 文本输入与编辑 任务三 应用图像 任务四 应用动画和多媒体 任务一 网页基本设置 任务说明 预备知识 一、设置文档头信息 二、设置文档页面属性 任务实施——为“欧妮雅”网站主页设置基本信息 任务二 文本输入与编辑 任务说明 预备知识 一、输入文本 二、设置文本格式 1．应用HTML类型 2．应用CSS类型 三、插入水平线和特殊字符 1．插入水平线 2．插入特殊字符 任务实施 一、为“欧妮雅”网站主页设置文本内容 二、为“欧妮雅”网站子页设置文本内容 任务三 应用图像 任务说明 预备知识 一、插入与编辑图像 二、制作鼠标经过图像 任务实施 一、为“欧妮雅”网站主页设置图像内容 二、为“欧妮雅”网站子页设置图像内容 任务四 应用动画和多媒体 任务说明 预备知识 一、插入Flash动画 二、插入音频文件 任务实施——为“欧妮雅”网站主页设置动画内容 * * 新建网页后，一般需要对页面进行一些简单的设置，主要包括头信息和页面属性，下面就来学习这些知识。 头信息包括网页关键字、网页说明等。在使用Google、Baidu、Yahoo等搜索引擎搜索网页时，不是检索网页的所有内容，而是只检索网页的关键字。如果希望自己的网页能够被搜索引擎检索到，最好把关键字设置为人们经常使用的词语。 通过设置页面属性，可以对网页的外观、标题及超链接等属性进行设置。 要设置页面属性，可在不选择网页文档中任何对象的前提下，单击“属性检查器”上的“页面属性”按钮，或者选择“修改”菜单下的“页面属性”命令，或按【Ctrl+J】组合键，打开“页面属性”对话框。 在学习了头信息和页面属性的设置方法后，下面通过为“欧妮雅”网站主页设置基本信息，来进一步巩固前面所学（具体操作见视频3-1）。 文本是网页最基本的组成元素，它能将各种信息有效地传达给浏览者，通常内容丰富的网页都有大量的文本。在Dreamweaver中可以直接输入文本，也可以从其他文档中复制文本，还可以插入水平线和特殊字符等。下面就来学习在网页中输入与编辑文本的相关知识。 在Dreamweaver中输入文本的方法非常简单，只要将插入点定位在网页的某个位置（如某个表格单元格内），然后选择输入法输入文本就可以了。对于大量的外部文本，可利用剪贴板将其拷贝至网页文档中。 文本属性检查器包括“HTML”和“CSS”两种类型，用户可使用这两种类型中的任一种来设置文本格式。应用HTML类型时，Dreamweaver会将文本格式属性添加到页面正文的HTML代码中。应用CSS类型时，Dreamweaver会将属性写入文档头或单独的样式表中。 如果属性检查器没有打开，请选择“窗口”“属性”菜单将其打开。选择要设置格式的文本或将插入点置于要设置属性的段落中，属性检查器中默认将显示文本的HTML类型属性。 单击属性检查器左侧的CSS按钮 ，可显示文本的CSS类型属性。 定位插入点后，选择“插入”“HTML”“水平线”菜单，即可插入水平线。此外，单击“插入”面板“常用”类别中的“水平线”按钮 ，同样可插入水平线。 如要插入版权符号，可在定位插入点后，选择“插入”“HTML”“特殊字符”“版权”菜单，插入版权符号。 如果在“特殊字符”下级菜单中没有找到需要的字符，可以通过选择该菜单中最下面的“其他字符”命令，打开“插入其他字符”对话框。 下面通过为“欧妮雅”网站主页设置文本内容，来进一步巩固和练习在网页中输入和设置文本的方法（具体操作见视频3-2-1）。 下面通过为“欧妮雅”网站子页（sub1.html）设置文本内容，来进一步巩固在网页中输入和设置文本的方法（具体操作见视频3-2-2）。 只有文字的网页会显得非常单调，而且容易引起视觉疲劳。为增加网页的可看性，我们可以适当地在网页中添加一些图像。下面就来学习图像在网页中的应用。 在网页中插入图像时，最好能保证网页和要插入的图像均位于当前站点中，否则很容易出现网页发布后看不到图像的情况。 要制作鼠标经过图像，需要用到两张大小相同，而内容不同的图像。其中一张作为原始图像，在页面打开的时候就显示；另一张则作为鼠标经过图像，在鼠标滑过的时候替换原始图像显示出来。下面我们来看鼠标经过图像的制作方法。 下面通过为“欧妮雅”网站主页设置图像内容，来进一步巩固和练习在网页中插入与编辑图像的操作（具体操作见视频3-3-1）。 下面通过为“欧妮雅”网站子页设置图像内容，来进一步巩固和练习在网页中插入与编辑图像的方法（具体操作见视频3-3-2）。 通过前面的学习，相信读者已经能够制作出简单的网页；不过细心的读者可能已经发现，前面介绍的网页中只有一些静止的图片和文字，显得过于单调。下面就来学习如何为网页添加动画和多媒体元素，以使网