移动端开发过程中，有的时候会遇到video播放（不让全屏播放），但是浏览器默认都是点击自动全屏去播放。下面看解决方法： HTML <div class="m-video"> <video x5-playsinline="" playsinline="" webkit-playsinline="" preload="none" poster="images/img7.jpg"> <source src="video/myvideo.mp4" type="video/mp4"> 您的浏览器不支持 video 标签。 </video> <!--自定义默认封面图--> <div class="bg" style="background-image:url(images/img7.jpg);"></div> <!--自定义播放按钮--> <a href="javascript:void(0);" class="btn"></a> </div> 从上述代码中可以看到video标签上多了几个属性： x5-playsinline ————————————该属性是让视频内联播放（兼容安卓和x5相关的内核） playsinline、webkit-playsinline—————该属性是让视频内联播放 preload———————————————视频加载时机，none为默认不加载（点击播放时再加载） poster————————————————video自带封面图属性 CSS .m-video video{object-fit: cover;} object-fit:cover;可以让video的宽高自动撑满父标签的宽高。 JS $(".m-video .btn").click(function(){ var that=$(this); var videoBg=that.prev(".bg"); var _video=videoBg.prev("video")[0]; if(_video.paused){ _video.play(); videoBg.hide(); that.addClass('on'); }else{ _video.pause(); videoBg..show(); that.removeClass('on'); } });