1

我正在使用 Video JS,我发现它非常棒,尽管我遇到了一个问题,因为当播放器处于全屏状态时,我无法更改字幕文本的字体大小。

我所做的是将 Video JS CSS 文件中的字体大小从 1.4em 更改为 4em。

/* Individual tracks */
.video-js .vjs-text-track {
  display: none;
  font-size: 1.4em;
  text-align: center;
  margin-bottom: 0.1em;
  /* Transparent black background, or fallback to all black (oldIE) */
  background: rgb(0, 0, 0); background: rgba(0, 0, 0, 0.50);
}

但它不起作用,它只会在视频播放器不是全屏时改变字幕字体大小。

你能帮我解决这个问题吗?我正在使用 Video JS 4.1 版

4

3 回答 3

4

似乎我所要做的就是在

.video-js .vjs-text-track-display

CSS 类

于 2013-08-16T12:52:42.583 回答
2

下面的代码对我有用。见https://github.com/videojs/video.js/issues/3301

.vjs-text-track-display div {
  font-size: 1.2em;
}

请参阅下面的完整代码:

<head>
  <link href="https://vjs.zencdn.net/7.6.6/video-js.css" rel="stylesheet" />

  <!-- If you'd like to support IE8 (for Video.js versions prior to v7) -->
  <script src="https://vjs.zencdn.net/ie8/1.1.2/videojs-ie8.min.js"></script>
</head>
<style>
.vjs-text-track-display div {
  font-size: 1.2em;
}
</style>
<body>

  <video id="dotsub_example" class="video-js vjs-default-skin" width="640" height="264"  poster="http://video-js.zencoder.com/oceans-clip.png" controls preload="auto" data-setup='[]'>
  <source src="//vjs.zencdn.net/v/oceans.mp4" type='video/mp4' />

  <track kind='captions' src='https://dotsub.com/media/5d5f008c-b5d5-466f-bb83-2b3cfa997992/c/chi_hans/vtt' srclang='zh' label='Chinese' default />
  <track kind='captions' src='https://dotsub.com/media/5d5f008c-b5d5-466f-bb83-2b3cfa997992/c/eng/vtt' srclang='en' label='English' />
  <track kind='captions' src='https://dotsub.com/media/5d5f008c-b5d5-466f-bb83-2b3cfa997992/c/spa/vtt' srclang='es' label='Spanish' />
  <track kind='captions' src='https://dotsub.com/media/5d5f008c-b5d5-466f-bb83-2b3cfa997992/c/fre_ca/vtt' srclang='fr' label='French' />
  </video>

  <script src="https://vjs.zencdn.net/7.6.6/video.js"></script>
</body>

于 2020-02-06T05:44:58.970 回答
0

以下代码对我有用,可能不需要 !important 部分:

.video-js .vjs-text-track-cue>div {
          font-size: 0.9rem !important;
}
于 2020-11-03T15:10:14.670 回答