1、网页设计与制作,第七章 多媒体元素在网页中的应用,讲解提纲,7.1 在网页中加入Flash元素 7.2 在网页中添加音频 7.3 在网页中添加其他多媒体元素,本章教学目标：,1掌握Flash按钮对象、Flash文本、Flash视频、FlashPaper等Flash元素的插入 2了解网页常见的音频格式 3掌握音频文件的链接、嵌入音频、使用动作播放音频等音频元素的操作技术 4掌握视频剪辑、插件、ActiveX控件内容、Java applet等多媒体元素的嵌入,7.1.1 插入Flash按钮对象,7.1 在网页中加入Flash元素,步骤1：在文档窗口中，将插入点放置在您要插入 Flash 按钮的地方
2、。在“常用”工具栏中，选择“媒体”按钮图标，然后选择“Flash 按钮”图标。将弹出“插入Flash按钮”对话框。 步骤2：从“样式”列表中选择您所需的按钮样式。在“按钮文本”域中（可选），输入需要显示的文本，也就是这里键入的文本将会代替“范例”中按钮上显示的“Button Text”。,步骤3：“字体”域中从弹出式菜单中选取一种要使用的字体，并指定该字体大小。 步骤4：在“链接”域中，为按钮输入文档的相对路径或绝对路径。（注：相对站点的链接不被接受，因为浏览器不能在Flash影片中识别这种路径。如果使用相对文档的链接，则一定要保证将SWF文件保存在与HTML文件相同的文件夹中。浏览器对相对文
3、档的链接解释方式不同，所以将按钮保存在与文档相同的文件夹可以保证链接正常工作。）,步骤5：在“目标”域（可选）中，指定打开Flash按钮所链接文档的目标框架或目标窗口。 步骤6：在背景颜色域（可选）中，为Flash影片设置背景颜色。 步骤7：在“另存为”域中，输入文件名称并保存新的SWF文件。 （注：如果文件包含相对文档的链接，必须将文件保存在和当前HTML文档相同的文件夹内以保证相对文档链接的正常使用。） 步骤8：点击“获取更多样式”前往Macromedia Exchange站点并下载更多的按钮样式。,步骤9：点击“应用”或“确定”按钮在文档窗口中插入Flash插入按钮。若要修改Flash按
4、钮对象，在“设计”视图中选取Flash按钮对象，“属性”面板就会显示Flash按钮性质。可以在“属性”面板中中进行修改。 若要对其内容进行修改，双击Flash按钮对象就可以。,7.1.2 插入Flash文本,步骤1：在文档窗口中，将插入点放置在您要插入 Flash 按钮的地方。在“常用”工具栏中，选择“媒体”按钮图标，然后选择“Flash 按钮”图标。将弹出“插入Flash按钮”对话框。 步骤2：从“样式”列表中选择您所需的按钮样式。在“按钮文本”域中（可选），输入需要显示的文本，也就是这里键入的文本将会代替“范例”中按钮上显示的“Button Text”。,步骤3：在“大小”域中输入字体大小
5、（单位：点）。 步骤4：点击合适的样式按钮设定样式属性，如粗体，斜体，文本对齐方式。 步骤5：在“颜色”域中，使用颜色拾取器或直接输入Web十六进制数值（如#FFFFFF）选取文本颜色。 步骤6：在“转滚颜色”域中，设置鼠标指针经过Flash文本对象上方时要显示的文本颜色。 步骤7：在“文本”域中输入所需的文本。若要在“文本”域中显示字体样式，选取“显示字体”选项。 步骤8：如果需要为Flash文本对象创建一个链接，在“链接”域中输入相对文档链接或绝对链接。,步骤9：如果输入了一个链接，可以在“目标”域中指定打开所链接文档的目标框架或目标窗口。 步骤10：在“背景色”域中，选择文本的背景颜色。
6、使用颜色拾取器或键入Web十六进制数值（如#FFFFF）。 步骤11：在“另存为”域中，输入文件名称。 如果文件包含相对文档的链接，必须将文件保存在和当前HTML文档相同的文件夹内以保证相对文档链接的正常使用。 步骤12：点击“应用”或“确定”按钮将Flash文本插入文档窗口中。 如果点击“应用”，对话框将不会关闭，可以在文档中预览Flash文本。,步骤1：在文档窗口中，将插入点放置在您要插入Flash影片的地方。在“常用”工具栏中，选择“媒体”按钮图标，然后选择“Flash Video”图标。将弹出“插入Flash视频”对话框。 步骤2：在出现的对话框中，选取一个Flash影片文件（.swf
7、）。文档窗口中将出现一个Flash占位符;若要设置 Flash 影片的属性，使用属性窗口。 步骤3：若要在“文档”窗口中观看影片的预览，单击“属性”面板中绿色播放按钮。单击停止按钮终止预览，也可以按F12键在浏览器中预览Flash影片。,7.1.3 插入Flash视频,7.1.4 插入FlashPaper,步骤1：在“常用”工具栏中，选择“媒体”按钮图标，然后选择“FlashPaper”图标。将弹出“插入FlashPaper”对话框。 步骤2：在“插入FlashPaper”对话框中，浏览到一个FlashPaper 文档并将其选定。 步骤3：如果需要，通过输入宽度和高度（以像素为单位）指定Fla
8、shPaper 对象在Web 页上的尺寸。FlashPaper 将缩放文档以适合宽度。,步骤4：单击“确定”在页面中插入文档。由于FlashPaper 文档是Flash 对象，因此页面上将出现一个Flash 占位符。 步骤5：若要预览FlashPaper 文档，请单击该占位符，然后单击属性检查器中的“播放”按钮。单击“停止”可以结束预览。也可以通过按F12 键在浏览器中预览该文档。FlashPaper工具栏在浏览器中具有全部功能。,7.2 在网页中添加音频 7.2.1 常见的音频格式,.midi 或.mid（乐器数字接口）格式; .wav（Waveform 扩展名）格式文件; .aif （音频
9、交换文件格式，或AIFF）格式; .mp3 （运动图像专家组音频，即MPEG-音频层-3）格式; .ra、.ram、.rpm 或Real Audio格式; .qt、.qtm、.mov 和QuickTime格式。,7.2.2 链接到音频文件,步骤1：选择要用作指向音频文件的链接的文本或图像。 步骤2：在属性检查器中，单击文件夹图标以浏览到音频文件，或者在“链接”文本框中键入文件的路径和名称。,7.2.3 嵌入音频,步骤1：在“设计”视图中，将插入点放置在要嵌入文件的地方，然后单击“常用”工具栏中的“媒体”按钮，然后选择“插件”图标。或者单击菜单栏【插入】【媒体】【插件】选项。 步骤2：在出现的对
10、话框中，选择所需的音频文件。,7.2.4 使用动作播放音频,步骤1：选择对象并打开“行为”面板。 步骤2：点击“+”按钮并从“动作”弹出式菜单中选择“播放声音”。 步骤3：点击“浏览”选取声音文件，或者在“播放声音”域中输入路径和文件名称。 步骤4：点击“确定”。 步骤5：检查默认事件是否是需要的事件。,7.3 在网页中添加其它多媒体元素 7.3.1 插入视频剪辑,步骤1：将剪辑放入站点文件夹。这些剪辑通常采用AVI或MPEG文件格式。 步骤2：链接到剪辑，或将其嵌入到页面中。若要链接到剪辑，请输入链接文本，如“剪辑下载”，选择文本，然后在属性检查器中单击文件夹图标。浏览到视频文件然后选择它，
11、建立链接文字。,7.3.2 插入插件,步骤1：在“文档”窗口的“设计”视图中，将插入点旋转在要插入内容的地方，在“常用”工具栏中，单击“媒体”按钮，然后单击“插件”图标。或者单击菜单栏【插入】【媒体】【插件】选项。 步骤2：在显示的对话框中，为Netscape Navigator插件选择内容文件。可以在页面中插入Active X控件。ActiveX控件（以前称作OLE控件）可以充当浏览器插件的可重复使用的组件，有些像微型的应用程序。ActiveX控件在Windows系统上的Internet Explorer中运行，但不在Macintosh系统上或Netscape Navigator中运行。Dr
12、eamweaver中的ActiveX对象为访问者的浏览器中的ActiveX控件提供属性和参数。,7.3.3 插入ActiveX控件内容,步骤1：在“文档”窗口中，将插入点放置在要插入内容的地方，然后单击“常用”工具栏中的“媒体”按钮上的下拉箭头，然后选择“ActiveX”图标。或者单击菜单栏【插入】【媒体】【ActiveX】选项。 步骤2：出现的图标标记出Internet Explorer中ActiveX控件将在页面上出现的位置。,7.3.4 插入Java applet,步骤1：在“文档”窗口中，将插入点放在要插入applet的地方，然后单击“常用”工具栏中的【媒体】按钮上的下拉箭头，然后选择
13、“Applet”图标。或者单击菜单栏【插入】【媒体】【Applet】命令。 步骤2：在出现的对话框中，选择包含Java applet的文件。,本章小结,Dreamweaver与Fireworks、Flash紧密联系的集成特性，可以在制作网页时直接应用Fireworks和Flash中的文件，在网页中插入图像和动画以使网页生动精美。还可以在Dreamweaver文件中插入QuickTime或Shockwave影片、Java applets、ActiveX控件或者其他音频、视频对象，以使网页动感十足。本章从以下几个方面进行了介绍：（1）Flash元素、（2）视频以及Shockwave插件、（3）音频,
