2013-02-08 68 views
2

我试图在Chrome中显示带有字幕的HTML5视频,但如果由于某种原因video元素正在继承某些样式属性,则字幕不会显示属性。Chrome HTML5视频字幕样式

例如,如果video元件被继承line-height属性则字幕不正确最小化模式和模式全屏之间变换。

enter image description here

检查examples page

我不能确定正确的样式为video > track元素。

我的主要担忧:是否可以在Chrome中操纵video > track元素的样式

我的第二个担忧是:这些元素中的line-height这种奇怪的行为是Chrome bug还是我的错?

+0

[Chrominium bug thread](http://code.google.com/p/chromium/issues/detail?id=175235) – fguillen 2013-02-08 23:12:04

回答

1

直到我们等待要固定,我们可以使用:-webkit-full-screen pseudoselector改变行高当视频在全屏模式的问题,这里的片段:

video{ line-height: 15px } 
video:-webkit-full-screen{ line-height: 30px } 

我对你的测试尝试页面(http://fguillen.github.com/ChromeVideoSubsStyle/),它似乎工作。

+0

作为一种魅力工作,而不是一个完美的解决方案,因为“线高度”在'-webkit-full-screen'模式将取决于屏幕分辨率,但它是一个非常好的解决方法! – fguillen 2013-02-10 19:26:03