码迷,mamicode.com
首页 > Web开发 > 详细

Html5-Video标签和字幕

时间:2016-03-08 20:57:32      阅读:463      评论:0      收藏:0      [点我收藏+]

标签:

<video id="mainvideo"   src="video.mp4" type="video/mp4"controls autoplay loop> 
<track src="en_track.vtt" srclang="en" label="English" kind="caption" default> 
<track src="cn_track.vtt" srclang="zh-cn" label="简体中文" kind="caption"> 
</video>

 

or

<video width="640" height="480" controls>  
  <source src="video.mp4" type="video/mp4" />  
  <source src="video.webm" type="video/webm" />  
  <track src="subtitles.vtt" kind="subtitles" srclang="en" label="English" />    
</video>  

  

track标签的属性主要有4个,如下表:

 

属性描述

kind

定义字幕内容类型,只能是这五种之一: subtitlescaptionsdescriptionschaptersmetadata.

src

字幕文件的URL地址

srclang

字幕文件的语言类型,标识信息的作用,播放器不使用这个属性。

label

字幕标签,每个字幕元素必需设置一个唯一不重复的标签,切换字幕时显示的名称。

default

指定是否是默认字幕。如果每个都不指定,将不会自动显示字幕.

 

关于属性的一些说明:
• 如果没有指定类型,默认为字幕(subtitles)。
• 如果类型是字幕(subtitles),需要指定srclang。
• 不能有两个相同类型(king)的轨道有同一个标签(label)

WebVTT字幕文件的MIME类型约定是"text/vtt",需要在IIS或者Apache等Web服务器中配置

TTML字幕文件的MIME类型约定为application/ttml+xml

Html5-Video标签和字幕

标签:

原文地址:http://www.cnblogs.com/imust2008/p/5255348.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!