html5 video标签,html5中video的属性方法
在过去，flash是解决网页视频问题的最佳方式，至今仍是主流。像优酷这样的视频网站和虾米这样的在线音乐网站仍然使用flash提供播放服务。但这种情况会随着HTML5的发展而改变。就视频而言，HTML5增加了视频，实现了播放在线视频的功能。
使用HTML5视频可以方便地使用JavaScript来控制视频内容等。功能非常强大，同时代码较少加快加载速度。另外跨平台更好，尤其是一些平板，手机等。比如苹果的产品不支持flash，只支持HTML5中的视频功能。
然而，HTML5的兼容性是一个严重的问题。我们可以使用视频来播放网页中的视频，但是使用早期浏览器的访问者可能无法正常观看这个视频。另外，由于视频编码器的历史渊源，各种浏览器支持的视频格式也不尽相同。要解决这些问题，如果想在网页中使用HTML5视频功能，可以遵循以下三个步骤。
第一步：提前准备好多格式视频文件
由于编码器的版权问题，不同的浏览器对视频格式的兼容性不同。目前没有一种视频格式能兼容所有浏览器，唯一的解决方案就是将视频转换成多种格式。
首先准备一个mp4格式的视频，可以在苹果设备上使用；其次，准备ogv格式的视频，在火狐浏览器中使用；最后，准备webm格式的视频，这个可以用在Google Chrome等。Webm由Google提出，开源免费，很可能成为兼容所有浏览器的视频格式。
准备多格式浏览器的麻烦在于格式的转换。视频转换工具在国内功能不多，转换格式可能不如后两者，质量良莠不齐，往往需要注册才能使用。推荐一款国外工具Online converter，一款在线免费视频转换工具。你甚至不需要安装软件，只需要选择相应的目标格式，然后上传视频，配置参数就可以转换了。没有合适工具的朋友可以试试。
第二步：编写对应 HTML5 video 代码
HTML5中的Video其实就是一个简单的标签，里面包含了一些视频相关的信息等等。下面我直接给出具体代码，然后简单解释一下：
XML/HTML代码将内容复制到剪贴板video width=" 800 " height=" 374 " sources RC=" my _ video . MP4 " type=" video/MP4 "/sources RC=" my _ video . ogv " type=" video/ogg "/Src=" my _ video . webm " type=" video/webm "/您的浏览器不支持视频功能。点击此处下载视频：a ahref="video.webm "下载视频/a ./video视频标签表示这是一段视频，宽度和高度属性分别表示这段视频内容的宽度和高度(单位像素)。video标签可以包含source标签，用于指示引用的视频和视频的格式和类型。为了保证向下兼容性，我们还在video标签中添加了一个提示，在支持video标签的浏览器中不会显示，如果不支持则会显示。这里还加了一个视频下载地址。如果浏览器不支持，用户可以选择下载观看。
需要注意的是，您的主机必须能够正确处理这些视频请求。当这些视频被请求时，确保你的主机在内容类型头中发送正确的MIME类型。不知道的可以咨询主机服务商或者自己添加。如果主机支持。htaccess，可以将下面的语句添加到。htaccess文件：复制如下代码：
AddType video/ogg。出口导叶
AddType video/mp4 .mp4
添加视频/网页类型。媒体文件格式
就是这样。比较简单，也比较具体。你可以搜索一下，也可以看到本文的延伸阅读链接，这里就不赘述了。
第三步：为旧版浏览器做兼容
如前所述，如果浏览器不支持视频，则会显示视频中的提示内容。那么，对付老浏览器，我们可以把这个提示内容换成传统的flash。这样，当浏览器与视频标签不兼容时，将显示视频的flash版本。例如：
XML/HTML代码将内容复制到剪贴板video width=" 800 " height=" 374 " sources RC=" my _ video . MP4 " type=" video/MP4 "/sources RC=" my _ video . ogv " type=" video/ogg "/object width= 800 height= 374 type= application/x-shock wave-flash data= fallback . swf param name= movie value= fallback . swf /param name= flashvars value= autoFile=video.flv//object /video可以按照原来正常的flash引入方法直接写入视频标签。这样，我们实现了跨浏览器兼容视频功能的使用。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。