网页制作初步.pptVIP

第2章 网页制作初步 本章学习目标 通过理论学习，了解网站制作前的准备，其中包括素材准备和站点结构的规划；了解网页中图像的分类及其特点；理解站点和链接的概念其中包括URL、绝对路径和相对路径的概念。 通过实例分析，掌握站点的建立及站点参数的设置方法、编辑站点的方法；熟练掌握网页文件的新建和保存方法；掌握文本和特殊字符的输入方法，学会创建列表；掌握在网页中插入日期、水平线等常见网页元素的方法；掌握设置网页属性的方法，了解网页文件头中各项内容的含义。熟练掌握在网页中添加图像及相关属性的设置方法、学会创建图像热点区域；熟练掌握在网页中设置超级链接的方法，学会站点链接资源的管理方法；掌握在网页中插入Flash元素的基本方法及相关属性的设置。 本章设计任务 构建一个以介绍厦门为主题的简单个人网站 2．1 创建和管理站点 2．1．1 建立站点前的准备工作 1．规划站点结构 （1）将站点内容分门别类，即将相关页面放置在同一文件夹内。 （2）单独放置图像、声音或其他多媒体文件。即将所有图像、声音或其他多媒体文件放在独立的文件夹内。 （3）对本地站点和远程站点使用相同的结构，在创建并测试完站点后，将所有文件都上传到远程站点，使本地结构完整地复制到远程站点上。 2．1 创建和管理站点 2．准备网页素材 2．1．2 创建和管理站点 1．创建站点 ① 在本地计算机上建立站点目录结构。 ② 启动Dreamweaver MX 2004。 ③ 单击菜单“站点”/“站点管理”，在弹出的“管理站点”对话框中单击“新建”按钮，在弹出的下拉菜单中单击“站点”项，将打开站点定义对话框（如图2-6所示）。 2．1 创建和管理站点 ④ 在站点定义对话框中，设置“站点名称”项和“本地根文件夹”项，如果需要指定默认图像文件夹，则设置“默认图像文件夹”项，勾选“自动刷新本地文件列表”项和“启用缓存”项。 ⑤ 单击确定按钮，回到“管理站点”对话框，单击“完成”按钮关闭该对话框。完成站点创建操作。 2．实例 3．管理站点 （1）编辑修改站点 （2）删除站点 （3）复制站点 2．1 创建和管理站点 4．管理站点文件 （1）创建文件 （2）重命名文件 （3）移动和复制文件 （4）删除文件 2．2 网页的新建、保存和编辑 2．2．1 新建、打开和保存网页 新建网页 打开网页 保存网页 2．2．2 设置页面属性 打开“页面属性”对话框的方法主要有以下四种： （1）单击菜单“修改”/“页面属性”。 （2）使用快捷键Ctrl+J。 2．2 网页的新建、保存和编辑 （3）在“文档”窗口下面的属性面板中，单击“页面属性”按钮。 （4）在“文档”窗口的空白处右击鼠标，在弹出的快捷菜单中选择“页面属性”项。 2．2．3 使用标签选择器 2．2．4 实例 （1）新建网页 （2）设置页面属性 （3）保存网页 2．3 文字的应用 2．3．1 在网页中编辑文字 1．输入文字 2．插入特殊字符 3．编辑文字 2．3．2 设置文字格式 1．字体格式的设置 2．文字颜色的设置 3．文字样式的设置 4．文字列表的设置 5．其他设置 6．设置段落格式 2．3 文字的应用 2．3．3 实例 （1）设置页面属性 （2）输入并编辑文字 （3）设置文字格式 2．4 插入水平线和日期 2．4．1 插入水平线 2．4．2 插入日期 2．4．3 实例 2．5 图像的应用 网页中的图形图像主要起到以下三个方面的作用： （1）美化网页。 （2）对事物作图形化说明。 （3）作为网页动态效果的载体。 2．5 图像的应用 2．5．1 常用Web图像格式 1．GIF图像 专门为Web图像而设计的图像格式 最多只能表现256种颜色 图像文件较小 文件扩展名为.gif 支持透明属性 支持动画 GIF图像常用于网页中的小图标、符号、动画标题等 2．5 图像的应用 2．JPEG图像 一种有损压缩的图像格式 压缩比可以达到非常高 文件变得非常小 文件扩展名为.jpg 支持24位真彩色 2．5 图像的应用 3．PNG图像 是Macromedia Fireworks默认的图形文件格式 只有在4.0及其以上版本的浏览器才能被正确识别 同时支持真彩色和透明属性 可以导出GIF动画 2．5．2 在网页中插入图像 1．插入图像的操作方法有以下四种： （1）利用菜单操作 （2）使用“插入”工具栏操作 （3）使用“资源”面板操作 （4）使用快捷键操作 2．5 图像的应用 2．设置图像属性 3．实例 （1）使用菜单插入图像文件xiamen.gif （2）使用“插入”工具栏插入图像文件ditu.gif （3）使用快捷键插