【怎么网络建设】使用标签播放各种视频的方法 -网络营销推广_网站建设设计

【怎么网络建设】使用标签播放各种视频的方法

发表日期：2018-11-12 17:26:16

【怎么网络建设】

【案例说明】

①在<audio>与<／audio>标签之间插入的内容是供不支持<audio>标签的浏览器显示的。i

②Opera浏览器不支持MP3格式的音频播放，读者可以在Chrome浏览器中验证播瑚MP3格式的音频。 {

③<audio>标签允许包含多个<source>标签。<source>标签可以链接不同的音频文件，测览器将使用第一个可识别的格式。例如下面的代码提供了两个不同的音频文件链接：

您的浏览器不支持音频标签．

<／audio>

5.2.3 视频标签<video>

大多数视频是通过插件（如Flash）来显示的。但是，并非所有浏览器都拥有同样的插件HTML5规定了一种通过视频标签<video>来包含视频的标准方法。<video>标签能够播放视期文件或者视频流。

1．<video>标签支持的视频格式及浏览器兼容性

<video>标签支持三种视频格式，在不同浏览器中的兼容性见表5-4。

音频格式 Ogg MPEG4	IE9 [ Firefox3.5 [ / / l	Opera 10.5 √	Chrome 10 ./ -/	Safari 3.0 √
WebM	I √	√	./	Safari 3.0 √

2．<video>标签的属性

<video>标签的属性见表5-5。

autoplay

controls

height

loop

preload

src

width

如果出现该属性，则视频在就绪后马上播放

如果出现该属性，则向用户显示控件，比如播放、暂停和音量控件

设置视频播放器的高度

如果出现该属性，则每当音频结束时重新开始播放

如果出现该属性，则视频在页面加载时进行加载，并预备播放。如果使用"autoplay”，则忽略该属性

要播放音频的URL

设置视频播放器的宽度

【案例5-6】使用<video>标签播放视频。

【案例展示】本例文件5-6.html在浏览器中的显示效果如图5-7所示。

【学习目标】掌握使用<video>标签播放各种视频的方法。

【知识要点】掌握用<video>标签播放的视频对浏览器的要求。

代码如下：

<!doctype html>

<html>

<head>

<title>视频标签video示例</title>

</head>

<body>

<video src="movie.ogg" width="320" height="240

controls="controls”autoplay="autoplay”>

您的浏览器不支持视频标签．

400-611-0508

全方位的营销咨询
精准的解决方案
一对一贴心服务