使用 WebVTT 在 YouTube 上定位字幕

Positioning subtitles on YouTube with WebVTT

根据 YouTube 的 documentation on subtitle formats, it supports positioning captions with the W3C's WebVTT format, and this seems to be evidenced out in the wild: most videos I've seen using positioning - including this test video and this music video - 使用 WebVTT 这样做。

我能够使用 align:start position:100% 成功地将字幕对齐到视频视口的右侧,但是我尝试的 align-leftalign-end 的任何变体只会恢复为默认值(中心)对齐。

W3C WebVTT spec 中示例 7 中的 line-left 语法指出:

The "line-left" or "line-right" only refers to the physical side of the box to which the "position" setting applies, in a way which is agnostic regarding the horizontal or vertical direction of the cue. It does not affect or relate to the direction or position of the text itself within the box.

但是当我尝试使用它来显式指定左对齐时,我在上传文件时从 YouTube 收到错误消息(第 17 行指的是第三个提示 - 实际错误是在线的 line-left 18):

WEBVTT
Kind: captions
Language: en

1
00:00:16.439 --> 00:00:20.998 align:start position:100%    // Successfully aligns right
میرے کنّاں دے چمکن جھمکے
Mere kannaan de chamkan jhumke
Sparkling jewels adorn my ears

2
00:00:21.038 --> 00:00:25.037 align:left position:0%       // Silently fails; falls back to centre alignment
میرے کنّاں دے چمکن جھمکے
Mere kannaan de chamkan jhumke
Sparkling jewels adorn my ears

3
00:00:25.837 --> 00:00:30.037 align:left position:0%,line-left      // Fails with errors
مینوں ویکھے ہوا وی پئی گھم کے 
Mainoon wekhe hawa wi pai ghum ke
Even the breeze turns around to get a glimpse of me

YouTube 根本不支持 line-left/line-right 语法吗,还是我只是用错了?如果不是,我如何强制我的字幕左对齐?

请注意,虽然我在旁遮普语中有每个提示的第一行,但视频的字幕文件本身是作为 English (United Kingdom) 上传的,并且 Language: en 标记在文件的开头,因此这不是从右到左的问题。

我发布这个答案纯粹是为了记录我用来使定位工作的方法,但我很乐意接受任何比我更了解规格说明的人的回答,这样做可以准确解释 WebVTT 中的定位是如何工作的。

自从第一次写下这个问题,并在大量阅读规范并针对它们进行测试后,我设法偶然发现了解决这个问题所需的正确代码排列,但有一些注意事项。

在大多数情况下,您可以使用:

<timecode> align:left position:0% size:50% 左对齐字幕

<timecode> align:right position:100% size:50% 将它们右对齐

<timecode> line:0% 将它们放在视频的顶部

...至少在我的特殊情况下。然而,这种方法似乎在较长的行上完全失败,这又回到了中心对齐。

我也不明白为什么,但 size 指令在我的视频中始终需要在 50% 左右:将其设置为过低或过高的值 - 包括 100%,因为CSS 中的案例 - 似乎也失败了。