HTML原生双语字幕需用标签，分别引用zh和en的WebVTT文件，kind="subtitles"、srclang合法、label直观；双语同显不支持，须JS合并或自定义渲染。
用
HTML 原生支持多语言字幕，靠的是 标签，不是 JavaScript 模拟或第三方库。它必须作为 的子元素，且放在 结束标签之前。
关键点：字幕文件必须是 WebVTT 格式（.vtt），不能直接写中文/英文文本进 HTML；浏览器根据 kind、srclang 和 label 决定是否显示、如何切换。
-
kind="subtitles"是必须的，kind="captions"侧重听力障碍者（含音效说明），普通字幕选subtitles -
srclang必须是合法的 BCP 47 语言码："zh"或"zh-CN"表示中文，"en"或"en-US"表示英文 -
label是用户在右键菜单里看到的名字，建议写成label="中文"和label="English"这样直观的值 -
default属性只能加在一个上，表示默认启用（但用户仍可手动关掉）
WebVTT 文件格式不能错，否则字幕完全不显示
哪怕 写对了，VTT 文件第一行不是 WEBVTT（大小写敏感、前后无空格），或者时间戳格式不对（如用逗号代替句点、缺少帧数），浏览器就会静默忽略整个文件——不会报错，也不会提示。
一个最简可用的中文 VTT 示例（保存为 cn.vtt）：
WEBVTT 1 00:00:01.000 --> 00:00:04.000 你好，欢迎观看本视频。 2 00:00:05.500 --> 00:00:08.200 这是第二句字幕。
英文同理（en.vtt），注意时间轴要和视频严格对齐；两份文件需与 HTML 同域，跨域需服务端配 Access-Control-Allow-Origin。
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
浏览器字幕菜单里看不到选项？检查这三处
常见现象：写了两个 ，但右键“字幕”菜单里只有一项、甚至空白。大概率是以下某个问题：
-
srclang值非法，比如写成srclang="chinese"或srclang="zh_CN"（下划线不行，要用短横线） - VTT 文件 HTTP 状态码不是 200（如 404、403），浏览器加载失败但不提示；打开开发者工具 Network 面板，过滤
vtt，确认状态码和响应内容 -
没有设置controls属性，字幕菜单根本不会出现（即使 JS 控制也依赖 controls）
想让中英字幕同时显示？原生不支持，得换思路
HTML5 规范明确要求：同一时刻最多激活一个 subtitles 类型的 。也就是说，无法靠纯 HTML/CSS 让中英双语并排显示。
如果业务真需要双语对照（比如语言学习场景），可行路径只有两个：
- 用 JS 解析两个 VTT 文件，合并时间轴，生成第三份 VTT（每条含「中文\n英文」），再用单个
加载 - 放弃
，用+currentTime事件手动渲染字幕层，完全自控样式和叠加逻辑（但失去系统快捷键、无障碍支持等原生能力）真正容易被忽略的是：WebVTT 的
、等 HTML 标签在字幕中会被忽略，高亮或颜色只能靠
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
