2013教科版选修3《制作动态网页》word教案.doc

1、1.2 动态网页制作 学习目标 （1）了解动态网页的有关知识。 （2）掌握 DHTML 的应用。 1.2.1 在 FrontPage 中插入横幅广告 操作步骤如下： （1）单击“开始”按钮，选择“程序” “Microsoft FrontPage”， “Microsoft FrontPage” 窗口，执行“文件” “保存文件”命令，将新建文件保存为 guanggao.htm。 （2）在 FrontPage 中执行“插入” “组件” “横幅广告管理器”命令，打开“横幅 广告管理器属性”对话框，设置宽度为 200，高度为 100，过滤效果为“分解” ，每幅图片 显示 3 秒，单击“添加”按钮，将所需

2、要的图片添加到“显示图片”列表框中，单击“上 移” 、 “下移”按钮调整横幅广告图像变换的次序，单击“确定”按钮。 （3）保存后在浏览器中进行预览，每隔 3 秒钟变换一幅图片。 1.2.2 在 FrontPage 中应用动态 HTML 效果 在 FrontPage 中应用动态 HTML 效果，操作步骤如下： （1）单击“开始”按钮，选择“程序” “Microsoft FrontPage”。打开“Microsoft FrontPage”窗口，执行 “文件” “保存文件”命令，将新建文件保存为 dtsg.htm。 （2）在 FrontPage 窗口中输入文本“助理电子商务师” ，然后选中文本执行“

3、格式” “动态 HTML 效果”命令，在出现的 “HTML 效果” 工具栏中进行设置。 （3）保存后在浏览器中进行预览。 1.2.3 插入字幕 1.2.4 建立及应用 CSS 样式文件 使用 FrontPage 建立名为 mystyle.css 的外部 CSS 样式文件，并在其他页面文件中应用 此样式文件。 1.创建 CSS 样式文件 操作步骤如下： （1）单击“开始”按钮，选择“程序” “Microsoft FrontPage”，打开“Microsoft FrontPage”窗口。 （2）在 FrontPage 窗口中，选择“文件” “新建” “网页” ，在“新建”对话框中单 击“样式表”选

4、择卡，选择要创建的样式类型，然后单击“确定”按钮。 （3）单击样式工具栏中的样式按钮，弹出“样式”对话框。 （4）单击“样式”对话框中的“新建”按钮，弹出“新样式”对话框，在“名称（选择器） ”中输入样式名称，单击“格式”按钮进行字体、段落、边框等设置，新建样式的设置。 （5）单击“确定”按钮后，会在“样式”对话框的样式栏中显示用户自定义的样式。再单 击“确定”按钮，完成样式文件的创建。 （6）执行“文件” “保存文件”命令，保存文件。 2.应用外部 CSS 样式 操作步骤如下： （1）新建页面文件并进行保存操作，输入文字内容“这是样式的应用” 。 （2）执行“格式” “样式表链接”命令，在打

5、开的“链接样式表”对话框中进行设置， 选择“所选的网页”选项，单击“添加”按钮选择所要链接的样式表文件，单击“确定” 按钮。 （3）选中文字，切换到 HTML 视图下，将区中的“ 这是样式的应用” HTML 语句修改为“这是样式的应用”，保存文件后浏览效果。 大多数时候可以不为具体的 HTML 标记符定义格式，而是定义一些开放的格式，在内 容需要的时候才引用这些格式。例如，在 mystyle.css 文件中定义了一个类样式 test，在 区中的段落标记 中应用了这个类样式。 相关知识 （一）DHTML 1、DHTML 的定义 又称动态网页，它将内容对象化，应用编程语言来操作页面上的对象，不必通

6、过服务 器就可以与用户交互信息，更新页面的内容。动态见面技术包括 javascript、vbscript、css、layer 等。 、DHTML 的基本结构 DHTML 的基本结构包括 HTML、CSS、脚本程序、浏览器对象和网页对象等。 DHTML 是基于 HTML 语言，通过 CSS 技术扩展了 HTML 的样式定义语法和语义， 用脚本程序或控制浏览器对象和网页对象，从而使页面具有动态效果和交互功能。 （二）CSS 层叠样式表 CSS 是一种用于定义网页内容显示样式的技术。通过样式可以设定许多属性，如字号， 颜色，页边距等。 样式表的建立要符合 CSS 规则，它们一般被定义成以下形式的句法

7、： HTML 标志 标志属性:属性值；标志属性 :属性值；标志属性:属性值；标志属性:属性值；. （三）脚本语言 1.脚本语言(JavaScript,VBscript 等) 介于 HTML 和 C,C+,Java,C#等编程语言之间。 HTML 通常用于格式化和链结文本。 而编程语言通常用于向机器发出一系列复杂的指令。 2.脚本语言与编程语言也有很多相似地方，其函数与编程语言比较相象一些,其也涉及 到变量。与编程语言之间最大的区别是编程语言的语法和规则更为严格和复杂一些。 3.与程序代码的关系:脚本也是一种语言，其同样由程序代码组成。注：脚本语言一般 都有相应的脚本引擎来解释执行。 4.脚本语

8、言是一种解释性的语言，例如 vbscript， javascript，installshield script 等等， 它不象 cc+等可以编译成二进制代码，以可执行文件的形式存在。脚本语言一般都是以文 本形式存在,类似于一种命令。 1.3 视频与音频 学习目标 （1）了解多媒体、视频和音频的基本知识 （2）掌握页面中插入视频和音频的方法 1.3.1 在页面中插入背景音乐 背景音乐标记符可以在展示页面的同时播放音乐，通常插在 区 中，注意不要插在 JavaScrip 语句之间。主要属性有： （1）src。链接的声音文件地址。 （2）loop。播放音乐的次数，当 loop0 时为无穷次循环。 示

9、例使用 背景音乐标记符在页面中插入背景音乐，操作步骤如下： （1）以“记事本”方式打开要插入背景音乐的文件或在 FrontPage 中切换到“HTML”试 图下。 （2）在其区中输入下列语句： （3）执行“文件” 、 “保存文件 ”命令，将文件保存为 s1-6.htm。 1.3.2 插入 FLASH 动画 在网页中插入的 FLASH 动画文件的格式为 SWF，在 FrontPage 中是使用标记 来定义 FLASH 动画文件的。 示例在 FrontPage 中插入 FLASH 动画，步骤如下： （1）单击“开始”按钮，选择“程序” “Microsoft FrontPage”，打开“Micros

10、oft FrontPage”窗口。 （2）在 FrontPage 中执行“插入”“高级”“插件”命令，打开“插件属性”对 话框并进行设置，如下图所示。 （3）执行“文件”“保存文件”命了，将文件保存为 flash.htm。 （4）在浏览器中进行预览。 相关知识： 1、多媒体知识 多媒体是声音、文字、图像和视频等多种媒体的组合。 2、视频知识 视频是将整个视频流中的每一幅图像逐幅记录，信息量非常大。数字视频是将传统模 拟视频（包括电视和电影）片段捕获转换成电脑能调用的数字信号，较常见的 VCD 就是 一种经过压缩的数字视频，因为视频是我们利用摄像机直接从实景中拍摄的，比较容易获 得，经过编辑再创

11、作后就成为我们需要的数字视频，也就是电影文件。数字视频总能使多 媒体作品变得更加生动、完美，而其制作难度一般低于动画创作。视频文件的格式主要有 3 种： （1）AVI 文件 AVI 文件图像质量好，可以跨多平台使用。体积过于庞大，而且压缩标准不统一。目 前 AVI 格式的视频文件使用比较普遍。 （2）MOV 文件 MOV 原来是苹果公司开发的专用视频格式，后来移植到 PC 机上。它与 AVI 大体上 属于同一级别（品质、压缩比等） ，但不如 AVI 使用普遍。 （3）MPG 文件 MPG 是压缩视频的基本格式。它的压缩方法是将视频信号分段取样（每隔若干幅画面 取下一幅“关键帧” ） ，然后对相

12、邻各帧未变化的画面忽略不计，仅仅记录变化了的内容， 因此压缩比很大。mpg 还有 MPV 和 MPA 两个变种。MPV 只有视频不含音频，MPA 是不 包含视频的音频。 3、音频知识 声音是多媒体的一个重要方面，它可以给多媒体带来令人惊奇的效果，还能最大限度 地影响显示的效果。在多媒体中的声音有音乐和音效两类。音乐除了我们熟悉的普通音乐 外，还有电脑特有的 MIDI 音乐。音效包括各种各样的声音，如拖动或点击鼠标时发出的 音乐等。 在模拟音频技术中，通常以磁介质来记录声音，存储介质的磁性变化将会直接影响到 模拟音频的回放质量。而数字音频没有这样的烦恼，即使被复制无数次，数字音频信号也 绝对不会

13、出现任何信号丢失或发生变化的情况。数字音频技术是通过将声波波形转换成一 连串的二进制的数据来保存声音的。它是未来音频处理的必然趋势。 可以使用 Macromedia 公司出品的音频编辑工具 Sound Forge 来对声音文件进行编辑。 声音文件的格式主要由 3 种： 1、WAV 文件 声音文件最基本的格式是 WAV（波形）格式。它把声音的各种变化信息（频率、振 幅、相位等）逐一转成 0 和 1 的电信号记录下来，记录的信息量相当大，其具体大小与记 录的声音质量高低有关。 2、MID 文件 MID 文件又叫 MIDI 文件，其记录方法与 WAV 完全不同。人们在声卡中事先将各种 频率、音色的信号固化下来，在需要发一个什么音时就到声卡里去调那个音。一首 MIDI 乐曲的播放过程就是按乐谱指令去调出那一个个音来。因此，MIDI 的文件体积都很小，即 使是长达十多分钟的音乐也不过十多 K 至数十 K。建议背景音乐使用 MID 格式文件。 3、MP3 文件 MP3 可以说是目前最为流行的多媒体格式之一。它是将 WAV 文件以 MPEG2 的多媒 体标准进行压缩，压缩后的体积只有原来的 1/10 至 1/15（约每秒 1M） ，而音质基本不变。