《网页设计与制作课件.ppt》由会员分享，可在线阅读，更多相关《网页设计与制作课件.ppt（148页珍藏版）》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、v授课班级：校选课授课班级：校选课vEmailEmail：vQQQQ群：群：212444338 学生作品要求：要求：严格按照老师安排的实验内容上实验，严格按照老师安排的实验内容上实验，不允许玩游戏等，一旦发现取消上机资格，不允许玩游戏等，一旦发现取消上机资格，实验成绩为零分；实验成绩为零分；请假：请假：要有辅导员签字的假条送给本课程老要有辅导员签字的假条送给本课程老师。师。上课要求：上课要求：v基本概念：基本概念：v1、什么是网页、网站？、什么是网页、网站？v2、网页有哪些构成要素？、网页有哪些构成要素？v3、常用网页设计工具有哪些？、常用网页设计工具有哪些？v4、网站怎么做？、网站怎么做？网
2、站、网页的概念网站、网页的概念2.1 2.1 什么是网页什么是网页 用用HTMLHTML语言编写的文件称为语言编写的文件称为HTMLHTML文件，以页面的形式呈文件，以页面的形式呈现在用户的屏幕上。现在用户的屏幕上。2.2 2.2 网站网站 存放网页的服务器存放网页的服务器 。因特网上一块固定的面向全世界。因特网上一块固定的面向全世界发布消息的地方，由域名发布消息的地方，由域名(也就是网站地址也就是网站地址)和网站空间构成，和网站空间构成，通常包括主页和其他具有超链接文件的页面。通常包括主页和其他具有超链接文件的页面。2.3 2.3 两者关系两者关系网站包含网页，一张网页最多是一个网站网站包含
3、网页，一张网页最多是一个网站构成网页的基本要素构成网页的基本要素vv文字：文字：文字：文字：标题、字号、字型等；标题、字号、字型等；vv图形：图形：图形：图形：菜单按钮、背景图形菜单按钮、背景图形vv链接标志：链接标志：链接标志：链接标志：vv声音和视频声音和视频声音和视频声音和视频:1、声音是多媒体网页的一个重要组成部分。网页中常用的声音文件格式有：、声音是多媒体网页的一个重要组成部分。网页中常用的声音文件格式有：MIDI、WAV、MP3和和AIF等。等。2、视频是网页中的一个重要组成部分。格式有：、视频是网页中的一个重要组成部分。格式有：ReaPlay、MPEG、DIVX等。采用视频文件可
4、以使等。采用视频文件可以使网页变得精彩而又生动。网页变得精彩而又生动。vv交互功能交互功能交互功能交互功能Internet区别其他媒体的一个重要标志是它的交互功能。例如：向某网站购买区别其他媒体的一个重要标志是它的交互功能。例如：向某网站购买商品时，提交相关的个人信息等。通常网页的交互功能都是利用表单来实现的。商品时，提交相关的个人信息等。通常网页的交互功能都是利用表单来实现的。制作网页的基本工具制作网页的基本工具v目前网页制作有两种方法：一种是利用网页制作工具进行制作，如使用FrontPage、Dreamweaver等；另一种是采用HTML超文本标识语言的专用格式来进行编制。(1)(1)Fr
5、ontPageFrontPage(2)(2)DreamweaverDreamweaver：与与Fireworks8Fireworks8、Flash8Flash8构成网页三剑客构成网页三剑客课课程程教教学学进进度度表表v(2011至至2012学年学年第第2学期学期)v校选课校选课2012年年级级1、2班班v总学时数：总学时数：36v讲授讲授18学时学时实践性教学环节实践性教学环节18学时学时v填表时间：填表时间：2012-2-5v第一部分：第一部分：MS FrontPage 2003 MS FrontPage 2003 应用应用v第二部分：第二部分：Flash 2004 Flash 2004 动
6、画制作动画制作v第三部分：网站建设一条龙第三部分：网站建设一条龙v第四部分：实际技能训练第四部分：实际技能训练v第五部分：第五部分：DreamweaverDreamweaver简单应用简单应用v第六部分：免费网站空间的申请第六部分：免费网站空间的申请v第七部分：课件下载地址第七部分：课件下载地址第一部分：第一部分：Microsoft Office FrontPage 2003 应应 用用1、启动：启动：用鼠标左键单击用鼠标左键单击“开始开始”按钮，选择按钮，选择“程序程序”下面的下面的“MicrosoftOffice”/“MicrosoftOfficeFrontPage2003”2、关闭：单击
7、命令菜单栏中的、关闭：单击命令菜单栏中的“文件文件”，选择，选择“退出退出”即可。即可。一、一、FrontPage2003基本操作基本操作FrontPage2003FrontPage2003的界面的界面标题栏菜单栏常用工具栏格式工具栏视图栏标记栏工作区1、界面介绍界面介绍任 务 窗口文件夹列表2、界面操作界面操作vv界面的移动：界面的移动：界面不是一成不变，可以按照用户的习惯界面不是一成不变，可以按照用户的习惯自行调整和变化，如工具栏、菜单栏等。自行调整和变化，如工具栏、菜单栏等。vv界面的打开与关闭：界面的打开与关闭：（1）菜单栏右击即可出现菜单选项）菜单栏右击即可出现菜单选项（2）视图菜单
8、）视图菜单工具栏工具栏工具菜单工具菜单3、网站规划网站规划网站的风格网站的风格1网站的结构网站的结构2网站的配色网站的配色3根据个人需要设置网站风格，如：根据个人需要设置网站风格，如：活泼、清纯、庄严。活泼、清纯、庄严。网站如一本书，需要有大纲，主网站如一本书，需要有大纲，主要目录、具体内容要目录、具体内容颜色的搭配非常重要，怎么配色颜色的搭配非常重要，怎么配色才能吸引用户进来观看才能吸引用户进来观看4、色彩搭配色彩搭配红色热情橙色时尚蓝色宁静绿色清新紫色神秘黑色深沉灰色高雅白色明快配色方案的操作：配色方案的操作：*点击菜单点击菜单“格式格式”-“主题主题”*点击任务窗口点击任务窗口-“主题主
9、题”*点击某个主题右击点击某个主题右击-“自定义自定义”5、设计草图设计草图二、网站二、网站v1.制作网站的流程制作网站的流程主题主题风格风格规划规划配色配色素材素材版面版面上传上传测试测试编辑编辑网站的设计原则网站的设计原则1 1 1 1）目标明确，重点突出）目标明确，重点突出）目标明确，重点突出）目标明确，重点突出2 2 2 2）主题鲜明，层次清晰）主题鲜明，层次清晰）主题鲜明，层次清晰）主题鲜明，层次清晰3 3 3 3）合理设置栏目）合理设置栏目）合理设置栏目）合理设置栏目4 4 4 4）正确定位整体风格）正确定位整体风格）正确定位整体风格）正确定位整体风格5 5 5 5）页面布局合理）
10、页面布局合理）页面布局合理）页面布局合理6 6 6 6）色彩搭配，和谐统一）色彩搭配，和谐统一）色彩搭配，和谐统一）色彩搭配，和谐统一7 7 7 7）多媒体功能适当应用。）多媒体功能适当应用。）多媒体功能适当应用。）多媒体功能适当应用。网站元素级别网站元素级别网站网站网站网站网页网页网页网页1 1 1 1网页网页网页网页2 2 2 2网页网页网页网页3 3 3 3文字文字表格表格图片图片动画动画视频视频2、创建、关闭站点、创建、关闭站点v利用模板创建利用模板创建：点击“文件”“新建”“由一个网页组成的网站”，选择所要的网站模板。v关闭网站关闭网站：点击菜单“文件”-“关闭网站”，这样即可关闭正
11、在编辑的网站。打开“文件”菜单，可以看到：关闭关闭关闭网站关闭网站退出退出3、站点管理、站点管理v打开站点打开站点：点击菜单点击菜单“文文件件”-“打开网站打开网站”，这，这样即可打开需要编辑的网样即可打开需要编辑的网站。站。v重命名站点重命名站点：点击菜单点击菜单“工具工具”-“网站设置网站设置”-“常规常规”-“网站名称网站名称”，在对应的文本框里即可，在对应的文本框里即可更改你想要取的名字。更改你想要取的名字。打开“文件”菜单，可以看到：打开打开打开网站打开网站3、站点管理、站点管理 文件夹列表打开：文件夹列表打开：点击点击菜单菜单“视图视图”-“”-“文件夹文件夹列表列表”（Alt+F
12、1Alt+F1）。）。在文件夹列表里，可以在文件夹列表里，可以新建文件夹、更改正文件夹新建文件夹、更改正文件夹名称及删除文件夹等操作名称及删除文件夹等操作，注意它的级别（层次）。注意它的级别（层次）。三、编辑网页三、编辑网页v新建网页：新建网页：单击命令菜单栏中的单击命令菜单栏中的“文件文件”，选择，选择“新建新建”，在屏幕的右面出现一个，在屏幕的右面出现一个“新建新建”工具工具栏，选择栏，选择“新建网页新建网页”下的下的“空白网页空白网页”，于是，于是一个新的网页一个新的网页“new_page_1.htm”就产生了。就产生了。v问题思考：问题思考：还有哪些方式可以还有哪些方式可以新建一张网页
13、新建一张网页？三、编辑网页三、编辑网页1、预览：预览：单击屏幕左下角的单击屏幕左下角的“预览预览”按钮，于是新网页在浏按钮，于是新网页在浏览器下的显示效果就出现了。再单击览器下的显示效果就出现了。再单击“设计设计”返回页面设计返回页面设计状态，可以继续修改。也可以单击菜单栏状态，可以继续修改。也可以单击菜单栏“文件文件”下的下的“在在浏览器中预览浏览器中预览/MicrosoftInternetExplorer”或直接按或直接按键可以在键可以在IE下预览制作的网页。下预览制作的网页。2、保存：保存：单击单击“文件文件”/“保存保存”，为文件起个名字，并修改，为文件起个名字，并修改“保存位置保存位
14、置”为为D盘上盘上“座号姓名座号姓名”文件夹，然后单击文件夹，然后单击“确确定定”。这样所有网页使用的文件都放在这个文件夹中，便于。这样所有网页使用的文件都放在这个文件夹中，便于使用和管理。例如：使用和管理。例如：888张三张三思考题：思考题：1、怎样找到你的文件夹？、怎样找到你的文件夹？2、如何修改已经存盘后的网页文件？、如何修改已经存盘后的网页文件？三、编辑网页三、编辑网页v设置网页属性：在网页上方右击，选中“网页属性”；(1)修改标题 (2)修改边距思考：思考：标题与名称区别标题与名称区别1、直接、直接输入汉字：输入汉字：在新建的在新建的“new_page_1.htm”页面上输入汉字信息
15、，并进行页面上输入汉字信息，并进行字体、字号、颜色字体、字号、颜色等相关修饰。等相关修饰。2、导入文字导入文字：打开打开“插入插入”菜单菜单-“文件文件”（注（注意选择文件的类型），就可以插入你需要的内容。意选择文件的类型），就可以插入你需要的内容。注意：导入文字内容的格式，如：注意：导入文字内容的格式，如：word、wps、txt、htm等等三、编辑网页三、编辑网页(文本文本)注：注：1、先输入文字，再进行排版。、先输入文字，再进行排版。2、边输文字边排版。、边输文字边排版。三、编辑网页三、编辑网页(文本文本)v选择文本选择文本：方法方法1：按住鼠标左键拖动即可：按住鼠标左键拖动即可方法方法
16、2：按住：按住“shift”键选择连续文本键选择连续文本方法方法3：连续按鼠标左键三次可选中整段文字：连续按鼠标左键三次可选中整段文字方法方法4：按住：按住“alt”键，点击鼠标左键可选中整段键，点击鼠标左键可选中整段文字文字v设置文本格式设置文本格式方法方法1：选中文字右击：选中文字右击-“字体字体”方法方法2：按住：按住“格式格式”菜单菜单-“字体字体”方法方法3：在格式工具栏，也可以设置字体：在格式工具栏，也可以设置字体三、编辑网页三、编辑网页(文本文本)v删除文本格式删除文本格式：方法方法1：选中文字，在字体对话框里进行更改。这样速：选中文字，在字体对话框里进行更改。这样速度很慢。度很
17、慢。方法方法2：选中文字，点击：选中文字，点击“格式格式”菜单菜单-“删除格式删除格式”（快捷键（快捷键ctrl+shift+z）方法方法3：撤消（快捷键：撤消（快捷键ctrl+z）v撤销、恢复撤销、恢复：ctrl+z、ctrl+yv格式刷格式刷：如果要连续使用格式刷，可以双击如果要连续使用格式刷，可以双击“格式刷格式刷”，即可多次使用，再次点击，即可多次使用，再次点击“格式刷格式刷”可取消。可取消。v添加边框、底纹添加边框、底纹：点击点击“格式格式”菜单菜单-“边框和底纹边框和底纹”三、编辑网页三、编辑网页(文本文本)v复制文本复制文本：方法方法1：Ctrl+c、Ctrl+v方法方法2：选择
18、文字，按住：选择文字，按住“Ctrl”键键-拖动鼠标左键放到存放的位置即拖动鼠标左键放到存放的位置即可。可。v剪贴板剪贴板：先打开先打开“编辑编辑”菜单菜单-“office剪贴板剪贴板”,选择多个对象选择多个对象复制，后再粘贴即可。复制，后再粘贴即可。v移动文本移动文本：方法方法1：选择文字，点击：选择文字，点击“编辑编辑”菜单菜单-“剪切剪切”Ctrl+X方法方法2：选择文字，按住鼠标左键拖动放到存放的位置即：选择文字，按住鼠标左键拖动放到存放的位置即可。可。三、编辑网页三、编辑网页(文本文本)v设置段落格式设置段落格式：1、段落间距段落间距：(1)直接按直接按“enter”键换行，距离较大
19、。键换行，距离较大。其代码其代码；(2)、直接按、直接按“shift+enter”键换行，距离键换行，距离很小。其代码很小。其代码；v2、插入符号插入符号：在在“插入插入”菜单菜单-“符号符号”对话框，可对话框，可以添加所需要的符号。以添加所需要的符号。实验：制作一张文字网页实验：制作一张文字网页四、修饰网页四、修饰网页(图片图片)v插入图片：插入图片：点击点击“格式格式”菜单菜单“插入插入”“图片图片”v设置图片属性：设置图片属性：大小、位置等。大小、位置等。v插入自选图形插入自选图形：点击点击“格式格式”菜单菜单“插入插入”“自选图形自选图形”v设置图形属性：设置图形属性：填充颜色、边框、
20、阴影样式、三维效填充颜色、边框、阴影样式、三维效果等。果等。v插入艺术字插入艺术字：编辑文字编辑文字四、修饰网页四、修饰网页(文字超链接文字超链接)v1、文字超链接：、文字超链接：先选中文字或其它对象：先选中文字或其它对象：(1)点击右键点击右键超链接超链接(2)常用工具栏常用工具栏插入超链接插入超链接(3)点击点击“插入插入”菜单菜单超链接（超链接（ctrl+K）v2、创建同一文件的超链接创建同一文件的超链接：步骤步骤(1)先选中某些文字或其它对象进行标记，制作标签。先选中某些文字或其它对象进行标记，制作标签。选定文字选定文字“插入插入”菜单菜单书签（书签（ctrl+k）(2)选定其它文字链
21、接到上面的文字上。选定文字选定其它文字链接到上面的文字上。选定文字超链接属性超链接属性本文档中的位置，选中即可。本文档中的位置，选中即可。3、设置超链接字体效果设置超链接字体效果：打开打开“网页属性网页属性”“高高级级”“启动超链接翻转效果启动超链接翻转效果”“翻转样式翻转样式”打打开后进行设置开后进行设置v思考题：思考题：1、如何从子页中返回主页？、如何从子页中返回主页？四、修饰网页四、修饰网页(文字超链接文字超链接)v设置超链接颜色设置超链接颜色：打开打开“网页属性网页属性”“格式格式”超链接、已访问过的链接、当前超链接。超链接、已访问过的链接、当前超链接。v设置超链接屏幕提示设置超链接屏
22、幕提示：先选中文字：打开先选中文字：打开“插入超插入超链接链接”对话框对话框右上方右上方“屏幕提示屏幕提示”，输入相应的内容，输入相应的内容即可。即可。v删除链接文字的下划线：删除链接文字的下划线：选中文字选中文字打开打开“字体字体”对话框对话框效果效果下划线。下划线。v创建电子邮件创建电子邮件：先选中文字或其它对象：点击右键先选中文字或其它对象：点击右键插入超链接插入超链接设置电子邮件地址即可。设置电子邮件地址即可。四、修饰网页四、修饰网页(图片超链接图片超链接)v不同元素的链接不同元素的链接：1、利用图片本身属性自带的链接、利用图片本身属性自带的链接默认链接选中图片默认链接选中图片图片属性
23、图片属性常规常规默认超链接。默认超链接。2、利用图片工具栏里图形工具建立热点链接。包括：长、利用图片工具栏里图形工具建立热点链接。包括：长方形热点、圆形热点、多边形热点。打开图片工具方形热点、圆形热点、多边形热点。打开图片工具选选中圆形热点中圆形热点在图像内拖动鼠标在图像内拖动鼠标编辑超链接。编辑超链接。实验二、制作一张网页实验二、制作一张网页实验二、制作两张网页实验二、制作两张网页v要求：网页中包括：(1)文字、图片 (2)文字、图片的超链接、书签 (网页内部链接、网页外部链接)其它自由发挥。四、修饰网页四、修饰网页(音频、视频音频、视频)v添加添加FLASH：点击点击“插入插入”菜单菜单-
24、“图片图片”“Flash影片影片”，选中你要添加的，选中你要添加的Flash动画即可。扩展名：动画即可。扩展名：swfv设置设置FLASH属性：属性：设置质量、大小、背景等。设置质量、大小、背景等。v制作按钮制作按钮：打开打开“插入插入”菜单菜单“交互式按钮交互式按钮”对话对话框；框；按钮类型：（按钮类型：（1）按钮）按钮（2）字体）字体（3）图像）图像四、修饰网页四、修饰网页(音频、视频音频、视频)v添加视频添加视频：点击点击“插入插入”菜单菜单-“图片图片”“视频视频”，选中你要添加的视频文件，再将添加的视频文件拖动放大选中你要添加的视频文件，再将添加的视频文件拖动放大即可。即可。v设置视
25、频属性：设置视频属性：（1）外观（）外观（2）常规（）常规（3）视频）视频v添加背景音乐添加背景音乐：点击点击“网页属性网页属性”菜单菜单“常规常规”“背景音乐背景音乐”。四、修饰网页四、修饰网页v1、主题：、主题：选择选择“格式格式/主题主题”，从任务窗口选，从任务窗口选择一种样式，会改变整体网页的背景效果。择一种样式，会改变整体网页的背景效果。v2、动态字幕：、动态字幕：在网页上选定一个位置，单击在网页上选定一个位置，单击“插入插入/WEB组件组件/组件类别组件类别/选择一种效果选择一种效果/字字幕幕”，单击，单击“完成完成”，在文本框中输入文字。，在文本框中输入文字。也可以添加背景图片。
26、也可以添加背景图片。v3、在网页中使用网站计数器：在网页上选定、在网页中使用网站计数器：在网页上选定一个位置，单击一个位置，单击“插入插入/WEB组件组件/组件类别组件类别/选择计数器选择计数器”四、修饰网页四、修饰网页(表格表格)v新建表格：新建表格：点击点击“表格表格”菜单菜单-“插入插入”-“表格表格”对话对话框框v删除表格删除表格：选中表格选中表格-“表格表格”菜单菜单-“删除单元格删除单元格”或或按按DEL键即可删除键即可删除v添加单元格、行和列添加单元格、行和列：在在“表格表格”菜单菜单-“插入插入”-“单元格单元格”v删除单元格、行和列删除单元格、行和列：将光标放在单元格上，点击
27、将光标放在单元格上，点击“表格表格”菜单菜单-“选择选择”-“单元格单元格”，再点击，再点击“表格表格”菜菜单单-“删除单元格删除单元格”。行和列方法相同。行和列方法相同。v选选择表格择表格、单元格、行、列、单元格、行、列：将光标放在单元格上，将光标放在单元格上，点击点击“表格表格”菜单菜单”-“选择选择”-“单元格、行、列、表格单元格、行、列、表格”。四、修饰网页四、修饰网页(表格表格)v添加、删除标题添加、删除标题：将光标放在任意一个单元格上，将光标放在任意一个单元格上，点击点击“表格表格”菜单菜单”-“插入插入”-“标题标题”v合并单元格合并单元格：选中两个或以上单元格右击选中两个或以上
28、单元格右击合并单合并单元格或选中元格或选中“表格表格”菜单菜单“合并单元格合并单元格”。v拆分单元格拆分单元格：选定要拆分的单元格，选中选定要拆分的单元格，选中“表格表格”菜菜单单“拆分单元格拆分单元格”。v文本表格互转文本表格互转：选中对象，点击选中对象，点击“表格表格”菜单菜单“转换转换”“将文本转换成表格将文本转换成表格”四、修饰网页四、修饰网页(表格表格)v设置细线边框：方法：首先打开“表格属性”，将边框颜色与背景颜色均设置为黑色，边框线设为0。再选中所有“单元格”，点击“单元格属性”，将单元格的边框颜色与背景颜色改为白色；最后再次打开“表格属性”，将单元格间距设为1即。原理：利用表格
29、的底纹（黑色）与单元格的底纹（原理：利用表格的底纹（黑色）与单元格的底纹（白色），中间有单元格与单元格之间的距离，然后白色），中间有单元格与单元格之间的距离，然后就产生了这条细线。就产生了这条细线。实验一：表格应用五、框架五、框架v新建框架：新建框架：点击点击“新建新建”“任务窗口任务窗口”“其它网其它网页模板页模板”对开对话框对开对话框“框架网页框架网页”。v设置框架的显示：设置框架的显示：选中一网页，点击选中一网页，点击“框架框架”菜单菜单“框架属性框架属性”对话框，对话框，1、点击、点击“框架网页框架网页”“框架框架”“显示框架显示框架”勾取消即可。勾取消即可。2、取消框架滚动条。、取消
30、框架滚动条。v重命名框架重命名框架：选中一网页，点击选中一网页，点击“框架框架”菜单菜单“框框架属性架属性”对话框，点击对话框，点击“名称名称”v调整框架调整框架：选中一网页，点击选中一网页，点击“框架框架”菜单菜单“框架属框架属性性”对话框，可以调整高度或宽度。对话框，可以调整高度或宽度。五、框架五、框架v拆分框架拆分框架：方法方法1：选中一网页，点击：选中一网页，点击“框架框架”菜单菜单“拆分框架拆分框架”对话框，进行拆分。方法对话框，进行拆分。方法2：将光标移动页面的：将光标移动页面的上边缘或左边缘，按住上边缘或左边缘，按住ctrl键，同时点击鼠标左键，并拖动键，同时点击鼠标左键，并拖动
31、鼠标，即可新建一个鼠标，即可新建一个“框架框架”。v删除框架删除框架：选中一框架，点击选中一框架，点击“框架框架”菜单菜单“删除框删除框架架”，即可删除框架。，即可删除框架。v嵌入式框架嵌入式框架：选中一网页，点击选中一网页，点击“插入插入”菜单菜单点击点击“嵌入式框架嵌入式框架”即可，另：双击打开属性对话框，可以设置即可，另：双击打开属性对话框，可以设置框架的相关属性。框架的相关属性。五、练习一五、练习一框架框架五、练习二五、练习二嵌入式框架嵌入式框架六、制作滚动字幕制作滚动字幕v1、插入：、插入：在网页空白处：单击：在网页空白处：单击：“插入插入/web组件组件/滚动字幕滚动字幕”，输入要
32、显示的信息。，输入要显示的信息。v2、修改代码修改代码（红色是要添加的代码！红色是要添加的代码！）vv求职意向求职意向v成绩单成绩单v能力展示能力展示vv思考：如果想让文字自上向下滚动怎么办？思考：如果想让文字自上向下滚动怎么办？down是是换行命令换行命令v3、鼠标悬停：如何在滚动字幕上实现：当、鼠标悬停：如何在滚动字幕上实现：当鼠标悬在鼠标悬在上面时就停止滚动，按下时就实现超级链接，离开上面时就停止滚动，按下时就实现超级链接，离开时继续滚动，下面粉色代码为实现代码。也可以直时继续滚动，下面粉色代码为实现代码。也可以直接用下面代码替换原来的代码。接用下面代码替换原来的代码。vv求职意向求职意
33、向v成绩单成绩单v能力展示能力展示v六、制作滚动字幕制作滚动字幕当鼠标悬停上当鼠标悬停上面时面时,字幕停止字幕停止滚动滚动.超链接地址和名称超链接地址和名称一种简单滚动图片制作方法一种简单滚动图片制作方法1：v将下面代码放在将下面代码放在和和之间就可以了：之间就可以了：滚动图片滚动图片图片边框宽度为图片边框宽度为0(无边框无边框)图片地址和名称图片地址和名称一种简单滚动图片制作方法一种简单滚动图片制作方法2：v将下面代码放在将下面代码放在和和之间就可以了之间就可以了vv有超链接的滚动图片有超链接的滚动图片vvv 超链接地址和名称超链接地址和名称4、滚动图片：、滚动图片：利用滚动字幕制作滚利用滚
34、动字幕制作滚动图片，并实现超级链接。动图片，并实现超级链接。vvvv动态滚动图片动态滚动图片vvvv第第5个单元格个单元格vv第第7个单元格个单元格v第第8个单元格个单元格vv第第10个单元格个单元格vvv显示图片命令显示图片命令图片地址和名称图片地址和名称七、使用书签七、使用书签v1、制作书签：、制作书签：在网页中选中某一段落的开头在网页中选中某一段落的开头作为书签的起始入口地址，然后单击作为书签的起始入口地址，然后单击“插入插入”/“书签书签”，确定。，确定。v2、制作目录：、制作目录：将各个做好的书签名字以目录将各个做好的书签名字以目录方式做好。方式做好。v3、使用标签：、使用标签：选中
35、目录某一项，超链接到书选中目录某一项，超链接到书签上就可以了。签上就可以了。八、插入层八、插入层v1、层：、层：在网页中选择适当的位置，单击菜单栏上在网页中选择适当的位置，单击菜单栏上的的“插入插入/层层”v2、输入数据：、输入数据：单击层，便可以向其中输入文字，单击层，便可以向其中输入文字，插入图片、动画等等信息。插入图片、动画等等信息。v3、移动：、移动：拖动层的左上角控制柄，就可以任意移拖动层的左上角控制柄，就可以任意移动层到任何位置。动层到任何位置。v4、重叠层：、重叠层：可以将多个层重叠，以达到一定的效可以将多个层重叠，以达到一定的效果。果。v5、改变层次：、改变层次：双击双击“层控
36、制柄层控制柄”，可以用鼠标拖，可以用鼠标拖动相应的层到任何位置，到达改变层的次序。动相应的层到任何位置，到达改变层的次序。九、使用超级链接九、使用超级链接v使用超级链接技术可以使多个网页相互链接在一起，使用超级链接技术可以使多个网页相互链接在一起，方便浏览。方便浏览。v1、分别按照前面的方法做好主、分别按照前面的方法做好主(首首)页和与其链接的页和与其链接的子页文件（子页文件（*.htm），并保存在一个文件夹中。），并保存在一个文件夹中。v2、在主页上输入提示进入子页的文字，作为超链接、在主页上输入提示进入子页的文字，作为超链接的按钮文字。的按钮文字。v3、选中按钮文字，再单击、选中按钮文字，
37、再单击“插入插入/超链接超链接”，找到，找到要链接的文件，确定。要链接的文件，确定。v【主页主页】【】【框架网页框架网页】【】【滚动新闻滚动新闻】【】【热点链接热点链接】【布局表格布局表格】【网页主题网页主题】【】【留言薄留言薄】v在网页中加入下面一段代码：在网页中加入下面一段代码：vv其中其中756519678是网页上欲留的是网页上欲留的QQ号。号。十二、在网页中插入十二、在网页中插入QQ对话对话十二、在网页中插入当前日期十二、在网页中插入当前日期vvdocument.write now()vv1、在、在D盘上建立一个以你自己的盘上建立一个以你自己的“座号姓名座号姓名”为名为名字的文件夹。例
38、如：字的文件夹。例如：88张三张三v2、启动、启动FrontPage2003，新建一个网页，并以，新建一个网页，并以index.htm为名保存在形如为名保存在形如“88张三张三”的文件夹里的文件夹里面，内容为介绍自己简历，并加图片。面，内容为介绍自己简历，并加图片。v3、按照前面介绍的网页制作技术分别建立不同的网、按照前面介绍的网页制作技术分别建立不同的网页页(例如求职意向、成绩单、爱好特长例如求职意向、成绩单、爱好特长)，并利用超，并利用超级链接技术链接到主页级链接技术链接到主页index.htm上。上。v4、实现网页间过渡效果设计。、实现网页间过渡效果设计。实验训练一：个人求职网站实验训练
39、一：个人求职网站v5、在主页、在主页index.htm上增加图片热点链接到上增加图片热点链接到三个子页上。三个子页上。v6、在主页、在主页index.htm上增加滚动字幕，并有上增加滚动字幕，并有三张不同的图片链接到三子页上。三张不同的图片链接到三子页上。v7、主页模板结构图如下：、主页模板结构图如下：实验训练一：个人求职网站实验训练一：个人求职网站实验训练一之实验训练一之问题回顾：v1、到实验室不知道做什么？、到实验室不知道做什么？不做笔记，不认不做笔记，不认真听课的结果。真听课的结果。v2、知道了做什么却不会做：、知道了做什么却不会做：缺少课前预习。缺少课前预习。v3、文件超链接不能用：、
40、文件超链接不能用：没有保存好就链接了没有保存好就链接了v4、文件在哪里找不到：、文件在哪里找不到：保存时没有看位置。保存时没有看位置。v5、滚动字幕：、滚动字幕：不能上下滚动，无超链接。不能上下滚动，无超链接。v6、图片热点：、图片热点：应选中图片后点击应选中图片后点击“图片编辑器图片编辑器”v7、测试：、测试：按按F12第二部分：Flash 2004 动画制作动画制作v1、启动、启动flash：“新建新建/flash文档文档/确定确定”。v2、绘制：、绘制：在右侧在右侧“工具工具”下面找到下面找到“椭圆工具椭圆工具”或或“铅笔铅笔工具工具”等开始作画，在不同的层画出一要表现的图形。等开始作画
41、，在不同的层画出一要表现的图形。v3、关键帧：、关键帧：在在“时间轴时间轴”上选择下一个帧，右点鼠标，选上选择下一个帧，右点鼠标，选择择“插入关键帧插入关键帧”。v4、变化：、变化：选择选择“任意变形工具任意变形工具”或或“箭头工具箭头工具”，改变你，改变你所画图形的样子，使其与上个帧的动作有稍许变化。所画图形的样子，使其与上个帧的动作有稍许变化。v5、插入关键帧：、插入关键帧：重复重复3、4动作，通过移动或改变图形的形动作，通过移动或改变图形的形状、大小、颜色等制作出多幅图片。状、大小、颜色等制作出多幅图片。v6、补间：、补间：选择某一祯区间，在选择某一祯区间，在“窗口窗口”找到找到“属性属
42、性/补间补间/形形状状”，当出现，当出现“”箭头时就可以连续动作起来了。箭头时就可以连续动作起来了。v7、播放：、播放：控制控制/测试影片（测试影片（ctrl+enter）。）。一、制作一、制作flash动画（动画（1）v1、启动、启动flash：“新建新建/flash文档文档/确定确定”，如图。，如图。v2、绘制：、绘制：在右侧在右侧“工具工具”下面找到下面找到“椭圆工具椭圆工具”或或“铅笔铅笔工具工具”等开始作画，画出一个完整的图形。等开始作画，画出一个完整的图形。v3、组合：、组合：有时需要将图像进行组合后进行变化，以免分散有时需要将图像进行组合后进行变化，以免分散开。利用箭头工具选中要
43、组合的图像，单击开。利用箭头工具选中要组合的图像，单击“修改修改/组合组合”。v4、变化：、变化：再选择再选择“任意变形工具任意变形工具”改变你所画图形的样式。改变你所画图形的样式。v5、插入关键帧：、插入关键帧：在在“时间轴时间轴”上右点鼠标，选择上右点鼠标，选择“插入关插入关键帧键帧”，并重复，并重复3、4动作，移动或改变图形的形状、大小、动作，移动或改变图形的形状、大小、颜色等。颜色等。v6、补间：、补间：选择某一祯区间，在选择某一祯区间，在“窗口窗口”找到找到“属性属性/补间补间/动动作作”，当出现，当出现“”时就可以连续动作起来了。时就可以连续动作起来了。v7、播放：、播放：控制控制
44、/测试影片（测试影片（ctrl+enter）。）。一一、制作、制作flash动画（动画（2）v1、启动、启动flash：“新建新建/flash文档文档/确定确定”。v2、新建元件：、新建元件：在在“插入插入/新建元件新建元件/影片剪辑影片剪辑/名称名称”，在名称栏输入，在名称栏输入“人人”。v3、画动画：、画动画：在工具栏选择画笔工具，选择一种颜色，在工具栏选择画笔工具，选择一种颜色，开始画人物，在同一层插入开始画人物，在同一层插入“关键帧关键帧”，改变人的，改变人的动作，重复此动作画动作，重复此动作画3帧。记得使用套索工具或橡帧。记得使用套索工具或橡皮工具。皮工具。v4、插入动画：、插入动画
45、：回到场景回到场景1，在，在“窗口窗口/库库”中找到你中找到你刚刚画的人物，拖入场景中。刚刚画的人物，拖入场景中。v5、设置动作：、设置动作：在场景中做此人物在不同时刻的位置在场景中做此人物在不同时刻的位置和路径、大小、旋转等。和路径、大小、旋转等。v6、播放：、播放：控制控制/测试影片（测试影片（ctrl+enter）。）。二二、制作、制作flash动画动画-人物人物v1、启动：进入开始、启动：进入开始/程序下启动程序下启动flash动画。动画。v2、测试：利用上节的办法制作动画，并测试、测试：利用上节的办法制作动画，并测试好。好。v3、发布设置：单击、发布设置：单击“文件文件/发布设置发布
46、设置”，在，在“格式格式”中选择中选择“GIF图像图像”复选框，并立即复选框，并立即为它命名，然后单击弹出的为它命名，然后单击弹出的“GIF”选项卡，选项卡，在在“回放回放”中选择中选择“动画动画”。v4、发布：单击、发布：单击“发布发布”按钮，一个按钮，一个gif动画动画就做成了。就做成了。三、制作三、制作gif动画图片动画图片gif动画图片效果动画图片效果四、将动画插入网页四、将动画插入网页v1、选择位置：、选择位置：在网页中选择的合适位置，准在网页中选择的合适位置，准备插入做好的动画。备插入做好的动画。v2、插入：、插入：单击单击“插入插入/图片图片/flash动画动画/”，找，找到你的
47、动画素材，确定。到你的动画素材，确定。v3、预览：、预览：单击单击“预览预览”，看一下大小、样式，看一下大小、样式是否合适，通过边框调节钮改变大小。是否合适，通过边框调节钮改变大小。v4、插入声音：、插入声音：在动画的适当位置插入在动画的适当位置插入“库库”中的声音或通过中的声音或通过“文件文件/导入到库导入到库”将其他的将其他的声音文件导入库中，新建一个音乐层，然后声音文件导入库中，新建一个音乐层，然后拖入到场景中即可。拖入到场景中即可。五、按钮动画五、按钮动画11、停止播放：、停止播放：按照前面的办法做好一个动画，并单按照前面的办法做好一个动画，并单击某一层的第一帧，插入击某一层的第一帧，
48、插入“停止停止”动作，目的是使动作，目的是使动画开始时不要自动播放。找到下方的动画开始时不要自动播放。找到下方的“动作动作-按钮按钮/影片控制影片控制”框，用鼠标拖动框，用鼠标拖动stop使其放入右侧的代使其放入右侧的代码框中，出现：码框中，出现：“stop();”2、加载按钮：、加载按钮：新建一个层，命名为按钮，从菜单栏新建一个层，命名为按钮，从菜单栏“窗口窗口/公共库公共库/按钮按钮”中选择一个按钮，如中选择一个按钮，如“arcadebuttons”，用鼠标拖动使之进入场景中适当位置。，用鼠标拖动使之进入场景中适当位置。3、按钮分身：、按钮分身：用鼠标依次拖动此按钮，会分身出来用鼠标依次拖
49、动此按钮，会分身出来5个不同颜色的按钮，可用于不同的控制功能。个不同颜色的按钮，可用于不同的控制功能。4、控制功能：、控制功能：选择其中的一个按钮，如绿色，再单选择其中的一个按钮，如绿色，再单击下方的击下方的“动作动作-按钮按钮/影片控制影片控制”框，用鼠标拖动框，用鼠标拖动play将其放入右侧的代码框中，出现：将其放入右侧的代码框中，出现：“play();”，于是当按下此键时开始播放动。，于是当按下此键时开始播放动。五、按钮动画五、按钮动画-代码代码(粉色粉色)5、停止动画播放：、停止动画播放：on(release)stop();6、停止声音播放、停止声音播放：stopAllSounds()
50、;7、跳转、跳转：on(release)gotoAndPlay(25);8、跳转到第、跳转到第2个场景的第个场景的第1帧播放帧播放：gotoAndPlay(“场景场景2”,1)9、跳转到当前帧：、跳转到当前帧：on(release)gotoAndPlay(_currentFrame);注释：对于低版本的软件要自己输入代码哦！注释：对于低版本的软件要自己输入代码哦！五、音乐按钮五、音乐按钮21、插入音乐：、插入音乐：在做好的动画中，增加一个新的层，在做好的动画中，增加一个新的层，起名为起名为“音乐音乐”。通过。通过“文件文件/导入到库导入到库”将将mp3声声音文件导入库中，或直接使用系统原有的声