本文概述
HTML <track>标记用于为媒体文件定义基于时间的文本轨道。 <track>标记必须用作<audio>和<video>元素的子元素。
<track>标记用于添加字幕, 标题或播放媒体文件时显示的任何其他形式的文本。
HTML <track>是HTML5中的新标记。
句法
<track src=" " kind=" " srclang=" " label=" ">以下是有关HTML <track>标记的一些规范
| Display | None |
| 开始日期/结束日期 | Only start tag(End tag forbidden) |
| Usage | HTML媒体 |
例
<!DOCTYPE html>
<html>
<head>
<title>HTML track Tag</title>
</head>
<body>
<h2>Example of track tag</h2>
<video controls="controls">
<source src="flower.mp4" type="video/mp4">
<track src="flower.vtt" kind="subtitles" srclang="en" label="English">
Sorry!Your browser does not support the track
</video>
</body>
</html>立即测试
在上面的示例中, 我们使用了flower.vtt文件在视频文件中添加字幕。以下是flower.vtt文件：
如何创建WEBVTT文件
以下是为<track>标签创建WEBVTT文件的一些基本步骤：
- 在PC中打开文本编辑器, 例如记事本
- 将WEBVTT编写为编辑器的第一行
- 留空行
- 以正确的格式指定持续时间（你也可以提供编号并添加CSS）。
- 输入并输入要添加字幕或标题的文本, 然后重复步骤3到5, 直到完成。
- 使用.vtt扩展名保存。
现在, 你的WEBVTT文件可以使用了。
属性
特定于标签的属性：
| 属性 | 值 | 描述 |
|---|---|---|
| default | default | 它指定应该启用该轨道, 除非用户的首选项指示另一个轨道更重要。 |
| kind | 字幕章节描述元数据字幕 | 它指定要添加的文本轨道的类型。 |
| label | text | 它指定文本轨道的标题。 |
| src | URL | 它定义了跟踪文件的URL。 |
| srclang | language_code | 它定义了跟踪文本内容的语言, 例如英语, 德语等。 |
全局属性：
<track>标记支持HTML中的Global属性。
事件属性：
<track>标记支持HTML中的Event属性。
支持的浏览器
| Element | Chrome | IE | Firefox | Opera | Safari |
| <track> | Yes | Yes | Yes | Yes | Yes |
