链接到多媒体文件
把视频和音频文件纳入到Web站点中的最简单的选项是利用<a>
标签简单的链接它。
例如如下代码
<a href="xxx.mov">click here </a>
当用户单击click here时,将会从你的Web服务器把QuickTime视频文件xxx.mov传输到他或她的计算机上。
嵌入多媒体文件
HTML长时间以来都包含一个标准的<object>元素,用于在Web页面中嵌入多媒体文件。
<object
width="xxx"
height="xxx"
type="video/x-ms-wmv"
data="pond.wmv"
</object>
与向Web页面中添加图像唯一真正的区别就是你在这里指定了文件类型(这里是video/x-ms-wmv)
<object>元素的width和height属性确定了嵌入式播放器的大小。如果没有设置这些属性,一些浏览器会自动调整嵌入式播放器的大小,以适应内容。
还有两个属性是显示合适的视频文件所必需的,它们是data属性和type属性,其中前者的值是想要播放的文件名(或者文件的URL),后者则用于标识要播放的媒体的类型。在这里是wmv文件,通过MIME类型指定。MIME类型是一个标识符,用于独特地标识Internet上的媒体对象的不同类型。MIME代表多用途国际邮件扩展。
列举出你可能希望在Web页面中使用的几种流行的声音和视频格式的MIME类型。
·WAV Audio:audio/vnd.wave
·MP3 Audio:audio/mpeg
·MP4 Audio:audio/mp4
·WMV:video/x-ms-wmv
·MPEG Video:video/mpeg
·MPEG4 Video:video/mp4
·QuickTime:video/quicktime
为音频和视频播放使用纯HTML5代码
使用<audio>
元素嵌入。
<audio
src="xxx.mp3"
preload="auto"
controls
autoplay
loop>
</audio>
在这里,src属性具有一个值,因为这是我想播放的音频文件的名称,除了src属性之外,我还将在这个<audio>元素中使用另外4个属性。
preload:具有3个可能的值:none,auto,metadata。如果不希望缓冲文件,就使用none;如果要缓冲文件,可使用auto;如果希望只缓冲文件的元数据,则使用metadata。
controls:如果存在,则显示用于音频播放器的控件。
autoplay:如果存在,则一加载完文件就播放它。
loop:如果存在,则继续重复播放文件,直到手动停止它为止。
(要注意在<audio>元素内给用户包含一条信息,如果用户的浏览器不支持,那么他将看到<p></p>标签内的消息)
使用HTML5<video>元素与使用<audio>元素相当类似。唯一真正改变是使用height和weigh属性定义被视频播放器和视频剪辑占据的空间。
<video
src="xxx.mov"
preload="auto"
width="320"
height="240"
controls
autoplay
loop>
</video>
preload,controls,autoplay和loop属性为<video>元素所做的事情与它们为<audio>元素所做的事情完全相同。
网友评论