什么也不说，先上设计出来的效果图！
VIDEO+CSS3效果图
如今HTML5已成网页、APP应用等开发炙手可热的一门技术，而视频播放器VIDEO也是其中一大亮点。在开发相关应用时，可能经常遇到video不兼容或其他疑难杂症的情况，但对症下药，问题也能迎刃而解。且看如下视频播放器VIDEO设置部分代码：
上面部分代码，几个值得注意的部分：
其一，在iOS中禁止全屏播放，需要在video标签加入属性 webkit-playsinline；
其二，在微信浏览器中，由于微信浏览器内核设置原理，需要添加属性x5-video-player-type="h5" x5-video-player-fullscreen="true"对应特殊属性来解决禁止全屏不起效的bug，另外需要设置object-fit: fill;来避免上下黑色部分。
下面我们来看下视频播放器及需要控制对象部分初始化代码：
初始各对象
事件监听部分：
还有进入全屏和退出全屏部分：
进入全屏代码
退出全屏代码
IOS上全屏控制时需要注意，需要移除或添加回对应控制属性，否则无效。
由于全部代码较长，无法一一显示，如需要了解全部代码，请关注我。