标签原生且唯一支持 WebVTT（.vtt）格式，因浏览器解析器严格校验：首行须为顶格大写 WEBVTT，时间戳毫秒三位（如00:01:23.456），不兼容 SRT 序号行或空行逻辑；改后缀无效，须用工具转码并确保 UTF-8 无 BOM、MIME 类型为 text/vtt。
标签原生支持 WebVTT（.vtt）格式，不是“兼容”，而是**唯一官方推荐且浏览器强制校验的字幕格式**。其他格式（如 SRT、ASS）必须先转成 VTT 才能被 正确加载和渲染。
为什么必须用 .vtt 而不是直接扔个 .srt？
浏览器对 的解析器只认 WebVTT 规范：首行必须是顶格大写 WEBVTT，时间戳毫秒位必须三位（00:01:23.456），且不接受 SRT 的序号行或空行逻辑。哪怕内容一模一样，把 .srt 改后缀为 .vtt 也会静默失败。
- Chrome / Firefox / Safari 都会直接忽略非标准 VTT 文件，控制台可能只报
Failed to load resource或更隐蔽的textTracks.length === 0 -
看似写了，但实际轨道根本不会注册进video.textTracks - 服务器返回的 MIME 类型也必须是
text/vtt，返回text/plain或application/octet-stream同样会导致加载失败
怎么把 SRT/ASS/TXT 转成合规的 .vtt？
别手动改——时间轴偏移、BOM、空行、序号错位全是坑。优先走自动化流程：
- 在线转换：用 TinyWow Subtitles Converter 或 SubtitleConverter.com，上传后选输出格式
VTT，勾选Auto-detect encoding和Remove invalid lines - 命令行（适合批量）：
ffmpeg -i input.srt -c:s:vtt output.vtt（注意 FFmpeg 5.1+ 才稳定支持此语法） - 桌面工具：Aegisub 导出时选
WebVTT (*.vtt)，保存前务必在编码选项里选UTF-8 without BOM - 转完立刻用文本编辑器打开检查：第一行是不是纯
WEBVTT（无空格、无空行、无 UTF-8 BOM）、时间戳是不是严格HH:MM:SS.mmm --> HH:MM:SS.mmm、中文是否正常显示
HTML 中怎么正确调用 .vtt 字幕？
必须是 的**直接子元素**，且位置必须在所有 之前。漏掉任一必需属性，轨道就不会出现在字幕菜单里。
DeepBI DHTML 页面生成器
下载
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
-
kind="subtitles"：不能写成caption、subtitles（末尾空格也不行） -
srclang="zh-Hans"：用 BCP 47 标准码，zh或zh-CN也行，但chinese无效 -
label="中文（简体）"：括号建议用全角，避免某些播放器截断 -
default：仅一个轨道可设，且只对kind="subtitles"或"captions"有意义；kind="chapters"加了反而可能干扰导航 - 跨域加载时，服务端必须返回
Access-Control-Allow-Origin: *，否则 Network 面板能看到 200 但textTracks为空
调试时最常被忽略的三件事
字幕没出来，90% 不是代码写错了，而是卡在这三个地方：
- VTT 文件用 Windows 记事本保存过 → 带了 UTF-8 BOM → 换 VS Code，另存为 “UTF-8”（不是 “UTF-8 with BOM”）
- 服务器没配
.vtt的 MIME 类型 → Nginx 加types { text/vtt vtt; }，Apache 加AddType text/vtt .vtt - 误以为
track.hidden = false能显示字幕 → 实际必须用 JS 控制textTracks[i].mode = "showing"，或者靠default属性触发
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
