video在移动端播放问题

1、不弹窗口出在当前页面小屏幕播放
只需在video标签加个webkit-playsinline属性即可，这个属性基本上在基于webkit内核的移动端都是没问题的，此全屏非彼全屏，它是在浏览器视窗内的全屏，并不是占居整个手机的全屏，当然我们做web端需要的就是在document的body内的视窗范围的全屏。

playsinline="true" /IOS微信浏览器支持小窗内播放/
or
webkit-playsinline="true"/这个属性是ios 10中设置可以让视频在小窗内播放，也就是不是全屏播放/
or
playsinline webkit-playsinline

2、poster视频封面
封面因为图片大小兼容问题有的居中显示没有全屏，可以设置css来控制
style="object-fit:fill" /加这个style会让 Android / web 的视频在微信里的视频全屏，如果是在手机上预览，会让视频的封面同视频一样大小 / fill or cover

    video {
        object-fit: cover;
      }

3、controls /这个属性规定浏览器为该视频提供播放控件/
4、x-webkit-airplay="true" /这个属性还不知道作用/
5、x5-video-player-type="h5" /启用H5播放器,是wechat安卓版特性/
6、x5-video-orientation="h5" /播放器支付的方向，landscape横屏，portraint竖屏，默认值为竖屏/
7、x5-video-player-fullscreen="true" /全屏设置，设置为 true 是防止横屏/
8、preload="auto" /这个属性规定页面加载完成后载入视频/

<video controls poster="./images/poster.png" width="100%" webkit-playsinline="true" x-webkit-airplay="true"  playsinline="true" x5-video-player-type="h5"x5-video-player-fullscreen="true">
 <source src="xxx.mp4"
                            type="video/mp4">
                    Sorry, your browser doesn't support embedded videos.
</video>