HTML的track标签kind设为subtitles怎么给视频配置多语言字幕切换-html教程-PHP中文网

必须显式写kind="subtitles"，且每个语言轨道都要配全srclang、label、src，否则浏览器根本不会把它当字幕处理——菜单里不显示，js也查不到；必须嵌套在内、紧接所有之后，位置错误则video.texttracks.length恒为0；kind值大小写敏感且仅限标准字符串，srclang须为bcp 47码如"zh-hans"，webvtt首行须为顶格全大写webvtt并紧跟空行，时间戳格式为hh:mm:ss.mmm --> hh:mm:ss.mmm，文件编码为utf-8无bom，服务端须返回content-type: text/vtt。

html的track标签kind设为subtitles怎么给视频配置多语言字幕切换

必须显式写 kind="subtitles"，且每个语言轨道都要配全 srclang、label、src，否则浏览器根本不会把它当字幕处理——菜单里不显示，JS 也查不到。

video 里 `<track></track>` 的位置和顺序不能错

浏览器只认嵌套在 <video></video> 内、紧接所有 <source></source> 之后的 <track></track>。放错位置等于没写，控制台不报错，但 video.textTracks.length 永远是 0。

<video><source src="a.mp4"><track kind="subtitles" srclang="zh" label="中文" src="zh.vtt"></track></source></video> ✅ 正确
<video><track><source></source></track></video> ❌ <track></track> 在 <source></source> 前，被忽略
<div><track></track></div> ❌ 不在 <video></video> 内，完全无效
动态用 JS appendChild() 插入 <track></track> ❌ 浏览器已解析完 DOM，不重新注册轨道

`kind="subtitles"` 的拼写和取值必须严格

写成 kind="subtitle"、kind="captions" 或留空，浏览器都当它不存在。不是容错项，是硬性准入门槛。

html-ppt-to-pdf

将使用 `

` 约定的 HTML 幻灯片转换为高保真、矢量文本 PDF（使用 Playwright + Chromium 原生 PDF 功能）。

下载

合法值只有 "subtitles"、"captions"、"descriptions" 等标准字符串，大小写敏感
"subtitles" 表示翻译性字幕（对话为主），适合外语视频；"captions" 含声音提示（如 [门响]），面向听障用户，UI 上常单独归类
移动端 Safari 对 kind 最苛刻：哪怕值正确，若没配 label 或 srclang，也会静默丢弃整个节点
srclang 必须是 BCP 47 标准码，"zh"、"zh-Hans"、"en-US" 可行；"ch"、"cn"、"chinese" 全部无效

WebVTT 文件本身必须合规，否则整个轨道加载失败

不是“文件名带 .vtt”就行。src 指向的文件一旦格式出错，浏览器会静默丢弃该轨道——不报错、不提示，字幕就是不出现。

首行必须是全大写 WEBVTT，后面紧跟一个空行
时间戳用点号分隔毫秒：00:01:23.450 --> 00:01:25.780，不能用逗号（SRT 格式）
文本块之间必须空一行，不能有多余空格或 BOM 字节
服务端必须返回 Content-Type: text/vtt，Nginx/Apache 需手动配置 MIME 类型
本地开发别用 file:// 协议打开 HTML——所有 .vtt 加载都会被禁掉，必须起本地服务（如 python3 -m http.server）

JS 切换字幕时要注意 readyState 和 mode 设置时机

直接对 track.mode = "showing" 赋值大概率无效，因为 VTT 文件还没加载完。必须等轨道就绪后再操作。

检查 track.readyState === 2（表示已加载完成），再设 mode
切换逻辑建议按 srclang 匹配，而不是下标索引：if (track.srclang === "zh") track.mode = "showing"; else track.mode = "disabled";
Safari 默认不启用任何轨道，即使写了 default 属性；必须靠 JS 显式设置 mode
移动端 iOS Safari 原生字幕控件默认隐藏，得自己渲染选择器并绑定点击事件

真正卡住人的地方不在语法，而在那些浏览器不报错却让功能彻底失效的细节：比如 srclang="zh" 写成 "ZH"，或者 WebVTT 文件开头多了一个 UTF-8 BOM，又或者把 <track></track> 放在了 <source></source> 前面——这些都不会抛异常，但字幕就是不出来。