HTML track 字幕与章节元素
track元素：WebVTT格式字幕/章节/描述、kind属性(subtitles/captions/descriptions/chapters/metadata)、srclang标签语言、与video/audio配合实现多语言字幕 · 难度：入门 · +10XP
HTML track 元素 —— 给视频加字幕
视频加上字幕，不仅方便听障人士，也让非母语用户能看懂内容。
基本用法
<video controls width="640">
<source src="movie.mp4" type="video/mp4">
<track src="zh.vtt" kind="subtitles" srclang="zh" label="中文" default>
<track src="en.vtt" kind="subtitles" srclang="en" label="English">
</video>WebVTT文件格式
WEBVTT
00:00:01.000 --> 00:00:03.000
大家好，欢迎来到我的教程。
00:00:03.500 --> 00:00:07.000
今天我们来学习HTML的基础知识。
track属性说明
| 属性 | 说明 |
|---|---|
| kind | subtitles/captions/descriptions/chapters/metadata |
| srclang | 语言代码（zh/en/ja） |
| label | 字幕选择菜单中的显示名称 |
| default | 默认启用的字幕轨道 |
动手练习
- 基础练习：准备短视频和WebVTT中文字幕文件，用video+track实现字幕显示。
- 进阶应用：制作中英文双语字幕——两个.vtt文件，通过菜单切换语言。
- 项目实战：给教学视频添加带样式字幕，使用::cue CSS选择器美化外观。