我的 html 看起来像这样：
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width">
</head>
<body>
<video controls="" autoplay="" name="media">
<source src="videoPath" type="video/mp4">
<track label="English" kind="subtitles" srclang="en" src="subs.vtt" default>
</video>
</body>
</html>
AS subs.vtt 是字幕文件。
如何更改附加到track元素的字幕大小？
我尝试创建一个 CSS 文件，然后给出track ID ，并在 CSS 中指定了其font-size，当然链接了 CSS 到 HTML ，但大小没有改变。
我还尝试了 .vtt 文件本身的样式：
WEBVTT
1
00:00:43.889 --> 00:00:46.949 size:200%
<i>Introduction...</i>
并且没有改变大小。
我也尝试了我在网上找到的类似的东西：
WEBVTT
<link href="style.css" rel="stylesheet" type="text/css" />
1
00:00:43.889 --> 00:00:46.949
<c vIntro><i>Introduction...</i></c>
和 css ：
.vIntro{
font-size: 5em;
}
，但这也没有改变大小。
我更喜欢一种方法，而无需触摸 .vtt file。
update ：是2021年，是在写出原始答案六年以上，而Shadow dom在更改的规格中获得了更大的支持。
原始答案：
在支持阴影dom的浏览器中，您可以设计字幕。它可能因浏览器而异，但是在Chrome 42（截至撰写本文时），您可以使用此CSS：
video::-webkit-media-text-track-display {
font-size: 200%;
}
鉴于那里有一个供应商的前缀，我想其他浏览器可能需要其他规则。再说一次，没有多少浏览器支持Shadow dom。截至撰写本文时，它只是Chrome，Opera和Android/Android/chrome-for-indroid。
它是一个旧的主题，但仍处于Google中的第一个结果。所以这是我的答案。
对于Firefox（我不知道其他浏览器），您可以将其放入CSS：
::cue {
font-size: 1.2em;
}