H5 video视频WebVTT字幕使用

时间：2024-01-23 07:46:47

H5 video视频支持外挂字幕，字幕文件后缀名是.vtt，专门的web字幕格式

字幕插入也非常简单，只需要在video标签内使用track标签

 

<body>
        <video controls>
          <source src="src/9A.mp4"  type="video/mp4">
          <track label="中文字幕"     kind="subtitles"    srclang="de" src="src/sing-song.vtt" default>
        </video>        
    </body>

 

sing-song.vtt文件格式如下

 

 

WEBVTT


00:00:00.001 --> 00:00:01.000
请把你的锅

00:00:01.001 --> 00:00:03.500
带回你的虾

00:00:03.501 --> 00:00:07.000
请把你的微笑留下……

00:00:07.501 --> 00:00:10.000
请把你的锅

00:00:10.001 --> 00:00:12.000
带回你的虾

00:00:12.001 --> 00:00:15.000
请把你的微笑留下

00:00:17.001 --> 00:00:19.000
我是Luna大魔王

00:00:21.001 --> 00:00:23.000
爱咋咋地~哼

 

 

 

字幕只需要自己添加时间和内容就可以了

相关文章