html - 如何在 iPad 上创建响应式 HTML 5 视频？

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/)这是响应式的，在所有主要浏览器中运行。

玩得开心！