如何在 iPad 上创建响应式 HTML 5 视频？答案

【问题标题】：How do you create a responsive HTML 5 video on iPad?如何在 iPad 上创建响应式 HTML 5 视频？
【发布时间】：2013-11-01 20:44:37
【问题描述】：

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

这是我的视频播放器

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

还有我的 CSS：

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

【问题讨论】：

【解决方案1】：

点击链接，这将帮助您创建 html5 响应式播放器，

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

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

玩得开心！

【讨论】：