angular - IE vtt轨道背景颜色

Question

为什么 IE 加载 .vtt 没有黑色背景而 chromes 加载，需要 IE 正常并且有黑色背景搜索没有占上风。

对此问题的任何帮助将不胜感激。

HTML：

 <video [src]='videoURL' controls (ended)="onVideoEnd($event)" [style.maxHeight]="screen.data.height">
    <track label="English" kind="subtitles" srclang="en" [src]="screen.data.ccs" default
 </video>

CSS

video {
    width: auto;
    position: absolute;
    top: 25%;
    left: 50%;
    height: 47%;
    width: auto;
    transform: translate(-50%, -50%);
}

video:fullscreen{
    transform: translate(0%, 0%);
}

铬合金：

IE：

Answer 1

请检查 CSS 样式，我猜您可能正在使用 ::cue CSS 伪元素来设置背景颜色。从这篇文章中，我们可以发现IE浏览器不支持这个属性。因此，它不会在 IE 浏览器中显示背景颜色。

我建议你可以尝试去掉背景色，这样在 Chrome 和 IE 浏览器中，它们将具有相同的样式（没有背景色）。

Answer 2

根据规范，您可以设置提示样式

video::cue {
  background-image: linear-gradient(to bottom, dimgray, lightgray);
  color: papayawhip;
}

video::cue(b) {
  color: peachpuff;

}

从记忆中，这在 IE 中有效。