如何在iPad上创建响应式HTML5视频？

Question

我已经创建了一个包含在响应式布局中的HTML5视频播放器。视频在桌面浏览器中可以正确调整大小，但在iPad上不能正确显示。视频的右侧和左侧都有大的黑色边框，视频看起来比应有的要小得多。

这是我的视频播放器

<video controls autoplay="true" poster="image.jpg">
    <source src="video.mp4">
    <source src="video.webm">
</video>

和我的CSS：

video {
    width: 100%;
    height: auto;
}

Answer 1

点击该链接可以帮助你创建html5响应式播放器

http://www.iandevlin.com/blog/2012/08/html5/responsive-html5-video

我建议你嵌入flowplayer (http://flowplayer.org/)这是响应式的，可以在所有主流浏览器上运行。

祝你玩得开心！