html5标签video在⾕歌浏览器下autoplay属性失效不会⾃动播放HTML部分
<div class="li-video">
<!-- poster="images/yx3.png" -->
<video width="402" height="402" controls autoplay muted>
<source src="images/video.mp4" type="video/mp4">
您的浏览器不⽀持 video 标签。
</video>
</div>
CSS部分
/* 视频 */
html代码属性大全.li-video {
width: 402px;
height: 402px;
position: absolute;
left: 350px;
top: 550px;
/* display: none; */
border: 1px solid #1071BD;
}
.li-video video{
background: #000;
width: 100%;
height: 100%;
}
效果图
video.png
解释
因为新版本的⾕歌浏览器考虑到⽤户体验，部分视频在⾃动播放准备就绪后，会⾃动把⾳量调
整到最⼤⽽播放，所以⾃18年就屏蔽了video的⾃动播放这⼀属性，不过在观察video标签的属
性可以发现它的另⼀个属性muted，muted 属性是⼀个 boolean(布尔) 属性。muted 属性设置或返回⾳频/视频是否应该被静⾳（关闭声⾳）。所以将muted属性加上后，浏览器可以⾃动播放但是为静⾳状态下，这时可以添加属性controls控件，⽤户可以⾃⼰⼿动点击播放，从⽽视频有声⾳。可以发现，淘宝的详情页也是如此，⼀开始进去页⾯后，视频⾃动播放⽆声视频，⿏标点击控件的播放按钮才有声⾳。
⾃古以来，开发⽔平就与头发量成反⽐，不怕⽣活给了⼀地鸡⽑，就怕给了⼀地头发。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。