资源简介

(共19张PPT)
3
插入多媒体
Part three
多媒体
1
插入图像
2
插入声音和视频
3
插入背景音乐
多媒体文件格式
图像文件类型:bmp、jpg、GIF和PNG格式等
音频文件类型:WAV、MP3、MID1、RA和RM格式等
视频文件类型:AV1和SWF格式等
4
插入AVI视频文件
一、Mate标签
格式:
功能:对HTML文件进行说明，文件的所有权及采用的字符集
网页特效
1）name项：常用的选项有Keywords(关键字) ，description(网站内容描述)，author(作者)，robots(机器人向导)等。
2）http-equiv项：可用于代替name项，常用的选项有Expires(期限)，Pragma(cache模式)，Refresh(刷新)，Set-Cookie(cookie设定)，Window-target(显示窗口的设定)，content-Type(显示字符集的设定)等。
3）content项：根据name项或http-equiv项的定义来决定此项填写什么样的字符串。
二、参数解析：
三、应用
1、告诉浏览器网页所识别的文件类型及语言类型，比如说，我们要让浏览器识别HTM/HTML类型的简体中文网面，我们可以这样写：
< Meta http-equiv="Content-Type" content="text/html; charset=gb2312" >
2、让一些搜索引擎搜索到你的网页，代码可以这样写：
< Meta Name=" Keywords" Content="网页关键字" >
< Meta Name=" description" Content="网页描述文字" >
网页特效
三、应用
3、让一个页面过上一定的时间，自动转到另一个页面或者站点去，如：
< Meta HTTP-equiv="refresh" content="6; url=http://hi./tesalo/" >
content中的6表示时间，单位为秒，url=后面是你要转向的网址，若是与你当前网页在同一目录下，可以直接写上文件名，如：
< Meta HTTP-EQUIV="refresh" content="6; url=page1.htm" >
网页特效
三、应用
4、让网页每隔一段时间刷新一次，若要10秒刷新一次，代码这样写：

网页特效
插入声音和视频
格式:< embed src="音频或视频文件URL地址">
功能:在网页中播放插入的音频或视频文件
src=“多媒体文件的地址”该属性为必要属性
Height和width属性用于设置多媒体对象的高宽
Loop属性用于设置播放的次数。若为true则无限重复播放，若为NO则播放一次。
多媒体
插入背景音乐
格式:< bgsound src="音频文件URL地址”>
功能:在网页中插入背景音乐。
src=“声音文件的地址”声音文件可以为wav/midi/mp3格式文件
Loop属性用于设置播放的次数。若为infinite则将循环播放。
多媒体
插入AVI视频文件
格式:< img dynsrc="AⅥI视频文件URL地址">
在网页中插入AVI视频文件
多媒体
背景图像
属性 控件名称 控件类型
type text 单行文本框
password 密码框
file 文件域
radio 单选框
checkbox 复选框
submit 提交按钮
reset 重置按钮
button 普通按钮
格式:
功能:在网页背景中插入指定的图像文件，默认为平铺
用css的style来设置
Background-repeat=“图像重复”（repeat|repeat-x| repeat-y|norepeat）
如：
背景图像
图像标记
属性 控件名称 控件类型
type text 单行文本框
password 密码框
file 文件域
radio 单选框
checkbox 复选框
submit 提交按钮
reset 重置按钮
button 普通按钮
属性 功能
width 设置图像显示的宽度,单位为像素或者百分比
height 设置图像显示的高度,单位为像素或者百分比
alt 图像的取代文字
align 设置图像的位置或其他内容与图像的对齐方式
boder 设置图像的边框大小
vspace 设置图像顶部和底部与其他内容之间的间隔，单位为像素
hspace 设置图像左侧和右侧与其他内容之间的间隔，单位为像素
格式:< Img src="图像文件URL地址">
功能:在网页中插入指定的图像文件
插入图像
图像的取代文字alt属性
属性 控件名称 控件类型
type text 单行文本框
password 密码框
file 文件域
radio 单选框
checkbox 复选框
submit 提交按钮
reset 重置按钮
button 普通按钮
格式:
功能:有些浏览器只支持文本,不支持图像,则可以采取一些其他办法来替代图像。标签中的alt属性能够提供帮助。当浏览器不能显示图像或找不到图像时,它可以将alt引导的文本显示在屏幕上,从而替代看不到的图像
Title:将鼠标放在图片上显示提示文本
Img标签
设定图像的高度和宽度 height/width
属性 控件名称 控件类型
type text 单行文本框
password 密码框
file 文件域
radio 单选框
checkbox 复选框
submit 提交按钮
reset 重置按钮
button 普通按钮
格式:
功能:标签中还提供了两个属性, height和widt,用来设定图像的高度和宽度,二者可取像素值或百分比
注意：图像所占的磁盘空间较少,则在网上传输所需的时间就比较短。因此,可以充分利用这两个属性,先在网页上建立一个占用磁盘空间较小的图像,然后再用这两个属性按比例放大,但倍数过大会模糊。所以要合适。同时需要使用小图片时，不要采用缩小图像的方法，这样网页传输的时间较长，应该用图像处理软件处理图像。
Img标签
设定图像的边框border属性
属性 控件名称 控件类型
type text 单行文本框
password 密码框
file 文件域
radio 单选框
checkbox 复选框
submit 提交按钮
reset 重置按钮
button 普通按钮
格式:
功能:img标签的border属性可以给图像加一个边框,若 border项默认或取值为0时,图像没有边框。
Img标签
设定图像的边框border属性
属性 控件名称 控件类型
type text 单行文本框
password 密码框
file 文件域
radio 单选框
checkbox 复选框
submit 提交按钮
reset 重置按钮
button 普通按钮
格式:
功能:img标签的border属性可以给图像加一个边框,若 border项默认或取值为0时,图像没有边框。
Img标签
设定图像的对齐方式align属性
属性 控件名称 控件类型
type text 单行文本框
password 密码框
file 文件域
radio 单选框
checkbox 复选框
submit 提交按钮
reset 重置按钮
button 普通按钮
格式:
功能:在标签中使用aigm属性,可控制图像相对于字基准线(文字中线)的水平对齐方式,属性设置值见书44页
Img标签
设定图像与文之间的距离 vspace/ hspace属性
属性 控件名称 控件类型
type text 单行文本框
password 密码框
file 文件域
radio 单选框
checkbox 复选框
submit 提交按钮
reset 重置按钮
button 普通按钮
格式:
功能:img标签中的 vspace和 hspace属性能够调整图像与其他文本之间的距离,两者均取像素值。设定语法格式如下:
n,m为数值,单位为像素。
其中, vspace为调整图像与上下文本的距离; hspace为调整图像与左右文本的距离。
Img标签
把文字排在图像下面
属性 控件名称 控件类型
type text 单行文本框
password 密码框
file 文件域
radio 单选框
checkbox 复选框
submit 提交按钮
reset 重置按钮
button 普通按钮
格式:


功能:如果文本还没有填满图像周围的空间,就希望从图像下面重新开始另一行文本时,普通换行标签
就不起作用了,它只能在图像旁边另起一行,而不能把文本排到图像下面去,
这就需要在
标签中使用 clear属性来满足这一要求
① clear=left文本在图像下面另起一行,用于图像在左边的情况
②cear=rght文本在图像下面另起一行,用于图像在右边的情况;
③ clear-all文本在图像下面另起行处。
Img标签
作业：完成下发的TASK8 中的作业
要求：利用记事本编辑网页，按照要求保存为HTML文件，自己预览后提交。有问题及时反馈练习。

展开更多......

收起↑