从html5视频中删除黑色背景.出现一秒钟

前端之家收集整理的这篇文章主要介绍了从html5视频中删除黑色背景.出现一秒钟前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
如何从 html5视频中删除黑色背景?加载时会显示几秒钟.使用CSS不起作用.

HTML

<div id="start-screen">
  <video id="video-element">
    <source src="video-mp4.mp4" type="video/mp4">
    <source src="video-oggtheora.ogv" type="video/ogg">
  </video> 
</div>

CSS(不工作):

#start-screen,video-element {
  background-color: #fff !important;
}

谢谢!

解决方法

我没有找到一个使用CSS的工作解决方案.但我发现使用非常小的白色(或任何你想要的颜色)海报图像就可以了.所以,如果你有同样的问题,我就是这样做的.我刚刚使用了一个100x100px的PNG文件(大小约为1KB).
<div id="start-screen">
  <video id="video-element" poster="/images/white-poster-image.png">
    <source src="video-mp4.mp4" type="video/mp4">
    <source src="video-oggtheora.ogv" type="video/ogg">
  </video> 
</div>

玩得开心!

猜你在找的HTML5相关文章