中职网页设计与制作教案：添加音频音乐
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
江苏省XY中等专业学校2021-2022-2教案编号：
教学内容
1、将素材中的“雪绒花.mp3”文件复制到站点根目录的“media”文件夹中。
2、打开要添加背景音乐的网页。
3、切换到DW的“代码”视图，将光标定位到<body>之后的位置，输入下面这段代码：<bgsound src="media/雪绒花.mp3" autostart=true loop=-1> src="media/雪绒花.mp3"：设定背景音乐文件。
autostart=true：设定网页下载后自动播放音乐。
loop=-1：设定音乐无限循环播放。
5.2.2插入音频文件
使用插件给网页添加音频文件是将声音添加到Web 页面的一种简单而有效的方法，如图所示。
实例4：
制作如上图所示的歌曲播放列表。
1、将素材中的“春天.mp3”文件复制到站点根目录的“media”文件夹中。
2、将插入点移至“雪绒花”右侧的单元格中，单击“插入”菜单“媒体”“插件”命令，打开“选择文件”对话框，选择“media”文件夹中的“雪绒花.mp3”。
教学内容
5.3创建滚动字幕
如下图网站中常见的滚动公告。
活动字幕会使整个网页更有动感，而且能够在有限的空间里滚动显示更多的内容。
这可以用html标签<marquee>轻松实现
滚动公告的代码：
<marquee onMouseOver =this.stop();onMouseOut =this.start(); scrollAmount=2 direction=up height=120> 好，感觉像正版，书内容也好看！<br>
还算干净也没什么破损。
<br>
纸质也还不错，很满意的一次购物。
<br>
书包装得不错，内容还没看，字清晰<br>
纸张质量也不错，稍微有点薄<br>
还没有读不过应该很好看<br>
都很喜欢，一本好书会带你走很远
</marquee>
•onMouseOver =this.stop();浏览时当鼠标移到字幕上时，字幕暂停滚动。
•onMouseOut =this.start();浏览时当鼠标从字幕上移动开始时，字幕继续滚动。
教学内容
•scrollAmount：表示字幕每次滚动的
距离，值越大滚动越快。
•width和height：表示滚动区域的大
小，width是宽度，height是高度，在做垂直
滚动的时候，一定要设height的值。
•direction：表示滚动的方向，默认为
从右向左，可选的值有：right、down、
练习1：
为实例1中页面右下方制作滚动字幕，如图5.10所示，
鼠标停留在文字上时文字停止滚动，单击文字打开小
站长介绍页面“xzz.html”。
【课堂小结】
教师引导学生小结本课所学内容。
【作业布置】
总结本课所学操作实用技巧。
知识积累：
<marquee>其它的
参数
behavior：用它来
控制滚动属性，默
认为循环滚动，可
选的值有：
alternate(交替滚
动)
slide(幻灯片效
果，指的是滚动一
次，然后停止滚
动)。
板
书
设
计
教后札记。