隐藏cc按钮的唯一可靠方式是修改track的kind属性为"captions"或移除subtitles类型轨道；若必须保留subtitles则需禁用原生控件并自定义UI。
track 元素本身没有图标，所谓“track 图标”其实是浏览器默认控件里的字幕按钮（cc 按钮）
很多人搜索“隐藏 track 图标”，实际想隐藏的是视频控件栏右下角那个 cc 按钮——它由浏览器根据 <track></track> 存在与否自动渲染，并非 <track></track> 自身的视觉表现。<track></track> 标签纯属元数据容器，不生成任何 DOM 节点，也无法用 CSS 选中或隐藏。
因此，问题本质是：如何让浏览器不显示字幕控件按钮，同时保留字幕轨道可用（比如 JS 动态启用）？
隐藏 cc 按钮的唯一可靠方式：移除所有 track 的 kind="subtitles" 或设为 captions
浏览器只在检测到 kind="subtitles" 且有 srclang 的 <track></track> 时，才显示 cc 按钮。只要不满足这个条件，按钮就消失。
- ✅ 正确做法：把
kind改成"captions"（即使内容是字幕）——多数浏览器不为此类轨道显示 cc 按钮 - ✅ 或者完全不加
<track></track>，等需要时再用 JS 动态video.addTextTrack()注入 - ❌ 不要试图用
display: none或hidden去隐藏<track></track>——它没渲染，CSS 和属性都无效 - ⚠️ 注意：
kind="descriptions"、"chapters"、"metadata"同样不会触发 cc 按钮
如果必须保留 subtitles 轨道但又不想显示 cc 按钮，只能接管整个控件栏
原生控件不可定制按钮级可见性。想彻底隐藏 cc 按钮又保留 kind="subtitles"，唯一办法是禁用原生控件，自己实现 UI：
Convert Markdown To HTML And PDF - Markdown和HTML、PDF互转
下载
实现 Markdown↔ HTML 互转，支持导出 PDF，用于用户请求的文档格式转换。
立即学习“前端免费学习笔记（深入）”；
- 给
<video></video>加controls="false"，完全关闭默认控件 - 手动创建播放/暂停/音量等按钮，并用
video.textTracks列出字幕轨道，自定义切换逻辑 - JS 控制示例：
video.textTracks[0].mode = 'showing'或'disabled' - ⚠️ 风险：失去原生字幕菜单的系统语言自动匹配能力；需自行处理跨域 VTT 加载限制
别碰 aria-hidden 或 pointer-events 来“隐藏 cc 按钮”
原生控件内的按钮无法通过 CSS 选择器定位（如 video::-webkit-media-controls-toggle-closed-captions-button 是私有伪元素，不稳定且仅限 WebKit）。
- ❌
aria-hidden="true"对 cc 按钮无效——它不在你的 HTML 中，你无法添加该属性 - ❌
pointer-events: none无法命中，因为按钮不是标准可选 DOM 节点 - ❌ 试图用
visibility: hidden或opacity: 0覆盖控件区域，会干扰其他按钮点击，且在 Safari 中常失效
真正可控的边界只在 <video></video> 标签本身和它声明的 <track></track> 元素上；超出这个范围的操作，基本等于和浏览器渲染引擎对赌兼容性。
