如何使用html5？

1、<video src="hanggemp4" controls></video>1
2，通过width和height设置视频窗口大小
<video src="hanggemp4" controls width="400" height="300"></video>1
3，预加载媒体文件
设置preload不同的属性值，可以告诉浏览器应该怎样加载一个媒体文件：
（1）值为auto：让浏览器自动下载整个文件
（2）值为none：让浏览器不必预先下载文件
（3）值为metadata：让浏览器先获取视频文件开头的数据块，从而足以确定一些基本信息（比如视频的总时长，第一帧图像等）
<!-- 用户点击播放才开始下载 --><video src="hanggemp4" controls preload="none"></video>12
4，自动播放
（1）使用autoplay属性可以让浏览器加载完视频文件后立即播放。
<video src="hanggemp4" controls autoplay></video>1
（2）如果启用自动播放，可以将播放器设置为muted状态。这样自动播放时会静音，防止用户厌烦。用户需要的话可以点击播放器扬声器图标重新打开声音。
<video src="hanggemp4" controls autoplay muted></video>1
5，循环播放
使用loop属性让视频播放结束时，再从头开始播放。
<video src="hanggemp4" controls loop></video>1
6，设置替换视频的（封面）
通过poster属性可以设置，浏览器在下面三种情况下会使用这个：
（1）视频第一帧未加载完毕
（2）把preload属性设置为none
（3）没有找到指定的视频文件
<video src="hanggemp4" controls poster="hanggepng"></video>1
7，浏览器兼容，如何让每一个浏览器都能顺利播放视频
现在大部分浏览器都能支持H264格式的视频，但Opera浏览器却一直不支持。我们需要通过后备措施保证每个人都能看到视频，通常有下面几种方案：
（1）使用多种视频格式
<video>和<audio>元素有个内置的格式后备系统。我们不使用src属性，而是在其内部嵌套一组<source>元素，浏览器会选择播放第一个它所支持的文件。
我们可以添加WebM格式的视频提供对Opera的支持。
<video controls>
<source src="hanggemp4" type="video/mp4">
<source src="hanggewebm" type="video/webm">
</video>1234
（2）添加Flash后备措施（推荐）
上面那个方法不推荐，应为Opera浏览器只占不到1%的份额。特意为它把视频都转码一边太费事。使用Flash作为备用播放方案还是很方便的，同时Flash还能兼容IE8这种连<video>元素都不支持的老浏览器。
这里使用Flowplayer Flash作为备用播放器（本地下载 ：flowplayer-3218zip）
<video controls>
<source src="hanggemp4" type="video/mp4">
<source src="hanggewebm" type="video/webm">
<object id="flowplayer" width="400" height="300"
data="flowplayer-3218swf"
type="application/x-shockwave-flash">
<param name="movie" value="flowplayer-3218swf">
<param name="flashvars" value='config={"clip":"hanggemp4"}'>
</object>
</video>1234567891011
（3）也有人优先使用Flash，而HTML5作为后备措施。
这么做是因为Flash普及率比较高，而HTML5作为后备可以扩展iPad和iPhone用户
<object id="flowplayer" width="400" height="300" data="flowplayer-3218swf" type="application/x-shockwave-flash">
<param name="movie" value="flowplayer-3218swf">
<param name="flashvars" value='config={"clip":"hanggemp4"}'>
<video controls>
<source src="hanggemp4" type="video/mp4">
<source src="hanggewebm" type="video/webm">
</video>
</object>

>

当媒体流正在播放时，客户端可以选择从许多不同的备用源中以不同的速率下载同样的资源，允许流媒体会话适应不同的数据速率。在开始一个流媒体会话时，客户端会下载一个包含元数据的扩展 M3U (m3u8) 播放列表文件，用于寻找可用的媒体流。

HLS只请求基本的>

苹果公司把HLS协议作为一个互联网草案（逐步提交），在第一阶段中已作为一个非正式的标准提交到IETF。2017年8月，RFC 8216发布，描述了HLS协议第7版的定义。

扩展资料：

客户端支持

1、  iOS从30开始成为标准功能。

2、  Adobe Flash Player从110开始支持HLS。

3、  Google的Android自Honeycomb（30）开始支持HLS。

4、  VODOBOX HLS Player (Android,iOS, Adobe Flash Player)

5、  JWPlayer (Adobe Flash)

6、  Flowplayer (Adobe Flash,使用hlsjs版本不使用Adobe Flash)

7、  Windows 10 的 EDGE 浏览器开始支持HLS。

1、在浏览器中直接打开新建的indexhtml，通过图示位置来输入文件代码。

2、下一步如果没问题，就继续输入参数代码。

3、这个时候等完成上述 *** 作以后，还需要输入样式代码进行确定。

4、这样一来会播放对应的视频，即可直接引用flowplayer了。

---