多媒体技术综合性实验.docx
《多媒体技术综合性实验.docx》由会员分享，可在线阅读，更多相关《多媒体技术综合性实验.docx（19页珍藏版）》请在冰豆网上搜索。
多媒体技术综合性实验
洛阳师范学院教育科学系
实验名称
编写HTML代码在网页中嵌入多媒体
实验类型
综合性
实验时间
2008年6月15日
实验环境
Windows操作系统
实验目的与要求：
掌握HTML常用标记的使用。
掌握编写HTML代码在网页插入声音、图片、视频（或动画）、超链接、等多媒体信息的语法规则。
实验内容：
1．编写网页设计的文字脚本，网页中应包含声音、图片、视频（或动画）、超链接、表格等元素。
2．准备好相应的声音、图片、视频、动画等多媒体素材，存放在一个以自己学号命名的文件夹内。
3．编写HTML代码制作一张名为“index.htm”的网页。
4．编写HTML代码在文件index.htm中实现文字脚本中的设计。
并把自己的脚本以正文的方式显示。
注：
为网页设置一定的背景颜色；插入背景音乐；在网页的顶端插入一张图片，居中显示；在图片的下面居中显示自己的姓名，设置合适的字号和字体颜色，加粗显示，并在姓名下加一条黄色的横线；网页中要有一个名为“个人简历”的表格。
边框宽度设为1，有合适的背景颜色，居中显示。
姓名
年龄
专业
毕业院校
5．创建一个以自己姓名命名的文件夹，文件夹内包括index.htm和素材文件夹。
将创建的文件夹压缩，上传至指定FTP进行提交。
实验方法、步骤：
1．新建一个文本文档，命名为index。
2．根据实验要求编写代码。
（1）把网页背景设为粉色，在网页顶端插入一张图片，居中显示。
…
…
……
（2）在图下居中显示“陶美予”设置号字型字号，并在名字下加一条黄色横线。
设置一个我BLOG的超连接。
…我的BLOG
（3）插入一个表格，做一个自己的小简历，边框宽度为1，背静颜色为浅蓝。
（4）分别插入几幅荷花图片，在图片下方合适的位置插入注释。
（5）插入FLASH动画
（6）插入背静音乐
（7）保存文件，把文件重命名为index.html
（8）打开预览。
代码如下：
DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN"
"http:
//www.w3.org/TR/html4/loose.dtd">
陶陶的网页
--
body{
margin-top:
0px;
margin-bottom:
2px;
background-color:
#FFCCFF;
}
a:
link{
color:
#FF0000;
text-decoration:
none;
}
a:
visited{
text-decoration:
none;
color:
#FF00FF;
}
a:
hover{
text-decoration:
none;
color:
#0000FF;
}
a:
active{
text-decoration:
none;
color:
#FFFF00;
}
.style20{
color:
#3333FF;
font-size:
12px;
}
.style21{font-size:
12px}
.style24{color:
#009933;}
.style25{color:
#000000}
.style26{
color:
#FFFF00;
font-size:
x-large;
font-family:
"CourierNew",Courier,mono;
font-style:
italic;
font-weight:
bold;
}
.style29{font-size:
xx-large}
.style30{font-size:
large}
.style32{font-size:
large;font-weight:
bold;}
-->
--
functionMM_reloadPage（init）{//reloadsthewindowifNav4resized
if（init==true）with（navigator）{if（（appName=="Netscape"）&&（parseInt（appVersion）==4））{
document.MM_pgW=innerWidth;document.MM_pgH=innerHeight;onresize=MM_reloadPage;}}
elseif（innerWidth!
=document.MM_pgW||innerHeight!
=document.MM_pgH）location.reload（）;
}
MM_reloadPage（true）;
//-->
absolute;left:
-42px;top:
586px;width:
770px;height:
7701px;z-index:
3;">
style="FONT-SIZE:
80pt;FILTER:
shadow（color=#AF0530）;WIDTH:
100%;WORD-BREAK:
break-all;LINE-HEIGHT:
150%;FONT-FAMILY:
华文中宋">style="FONT-WEIGHT:
bold">雨荷清韵
秋雨轻悄，与秋风执手
而来，绵密地散布着秋的讯息。
break-all;LINE-HEIGHT:
150%"
color=#00fa9asize=5>
size=5>蓦然，一片荷塘无遮无拦地展现在我的眼前，
size=5>水光潋滟处，浮泛着荷的清影——想不到在这样
size=5>一个地方，居然可以捕捉到荷塘清韵！
style="FONT-SIZE:
15pt;WORD-BREAK:
break-all;LINE-HEIGHT:
150%;FONT-FAMILY:
长城楷体">
size=5>惊呆了，傻傻地欣赏着，甚至忘记了扯着大嗓门聒
size=5>噪，还相互悄悄低语：
“嘘，别去惊扰它们！
”
style="FONT-SIZE:
15pt;WORD-BREAK:
break-all;LINE-HEIGHT:
150%;FONT-FAMILY:
长城楷体">
|
size=5>荷们随风轻摆，伴雨浅歌，清幽的香气缓缓散逸。
size=5>侧耳倾听，我仿佛听见了荷们洁白的花语，声声阵阵，拂
size=5>去了凡俗的喧嚣，也让我的心无言沉醉，频频摁下快门，
将白荷的雨中风姿定格为永恒。
lang=EN-US
style="FONT-SIZE:
15pt;WORD-BREAK:
break-all;LINE-HEIGHT:
150%;FONT-FAMILY:
长城楷体">
style="FONT-SIZE:
15pt;WORD-BREAK:
break-all;LINE-HEIGHT:
150%;FONT-FAMILY:
长城楷体">
size=5>“我打江南走过，那等在季节里的容顏，如莲花般
size=5>开落。
东风不来得及，三月的柳絮不飞。
你的心如小小的
size=5>寂寞的城，恰若青石的街道向晚。
跫音不响，三月的春帷
size=5>不揭，你底心是小小的窗扉緊掩。
我哒哒的马蹄是美丽的
size=5>错误，我不是归人，是个过客。
”
style="FONT-SIZE:
15pt;WORD-BREAK:
break-all;LINE-HEIGHT:
150%;FONT-FAMILY:
长城楷体">