HTML 视频在 iPhone 上不可见答案

【问题标题】：HTML Video not visible on IPhoneHTML 视频在 iPhone 上不可见
【发布时间】：2020-06-17 00:08:41
【问题描述】：

我在网站上嵌入了视频标签。该视频可在除 iPhone 之外的所有设备和浏览器（Windows、Android）上正常运行。

这是我的代码：

<div class="player" id="video">
    <video onloadeddata="this.play();" playsinline="" loop="" muted="">
          <source src="content/example.mp4" type="video/mp4">
          <source src="content/example.webm" type="video/webm">
    </video>
</div>

这是我的 Div 和 Video 标签的 CSS：

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

.player {
    max-width: 930px;
    margin: auto;
}

有人可以帮我解决这个问题吗？如果您需要，我可以发布更多信息。

谢谢！

【问题讨论】：

标签： html css iphone video

【解决方案1】：

你可以这样做：

 <video style="width:100%" controls autoplay>
    <source src="content/Vik_Virt_Video_30fps_slow.mp4" type="video/mp4">
<source src="content/Vik_Virt_Video_30fps_slow.webm" type="video/webm">
</video>

可以使用视频标签，它在 iPhone 上工作得非常好

【讨论】：

【解决方案2】：

你的 HTML 没问题：

这是IOS 的问题

禁用手机的省电模式并尝试是否可行，

另外，请查看此文档：safari 允许在某些条件下自动播放：

https://developer.apple.com/library/archive/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations.html

【讨论】：