Question

这适用于 Chrome，但不适用于 Safari。

<video id="video" class="video" preload="metadata" autoplay="" loop="" muted="" >
   <source src="images/video.mp4" type="video/mp4">
</video>

Answer 1

mp4 视频的编解码器是 H.264。要播放此视频，我必须将此 mp4 转换为 HEVC。瞧，这就解决了！

<video id="video" class="video" preload="metadata" autoplay="" loop="" muted="" >
            <!-- for safari - HEVC -->
            <source src="images/video.mp4" type="video/mp4"> 
            <!-- for chrome - H264 -->
            <source src="images/video.mp4" type="video/mp4">
</video>

Answer 2

我添加了几行代码，因为此背景视频无法在移动设备上播放（iphone chrome 和 safari）

<video id="video" class="video" preload="metadata" autoplay muted loop playsinline>
        <!-- below is for safari - HEVC format -->
        <source src="images/home-video.mp4" type="video/mp4">
        <!-- for google -  H264 format -->
        <source src="images/hero-video.mp4" type="video/mp4">
        <!-- for mobile -->
        <source src="images/hero-video.webm" type="video/webm">
        <source src="images/hero-video.ogg" type="video/ogg">
</video>

现在我遇到了这个视频无法在 Android（Chrome）上播放的问题。smh

Safari 不播放 .mp4 视频

2 个答案: