一.HTML5 video标签中的新属性

• autoplay:如果出现该属性，则视频会自动播放。
• controls:如果出现该属性，则向用户展示所有控件，比如播放条，声音、时间
• height: 设置视频播放器的高度。
• loop：循环播放，播放完成后从头开始，类似于酷狗的单曲循环。
• muted：规定视频的音频输出应该被静音。
• poster：规定视频下载时显示的图像，或者在用户点击播放按钮前的图像。
• preload：视频在页面加载时加载，并预备播放。
• src：播放视频的URL。
• width：设置视频播放器的宽度。

  二.css隐藏控件

  ```js

/ 全屏按钮 /
.active::-webkit-media-controls-fullscreen-button {
display: none;
}

/ 播放按钮 /
.active::-webkit-media-controls-play-button {
display: none;
}

/ 进度条 /
.active::-webkit-media-controls-timeline {
display: none;
}

/ 观看的当前时间 /
.active::-webkit-media-controls-current-time-display {
display: none;
}

/ 剩余时间 /
.active::-webkit-media-controls-time-remaining-display {
display: none;
}

/ 音量按钮 /
.active::-webkit-media-controls-mute-button {
display: none;
}

/ 音量控制条 /
.active::-webkit-media-controls-volume-slider {
display: none;
}

/ 所有控件 /
.active::-webkit-media-controls-enclosure {
display: none;
}

// 如果不生效，加！important;
```

三.用js里面的dom去控制样式

总结：一般在项目中都是动态显示控件，利用属性肯定不行，其实最方便的还是第二种，只需给一个动态的class即可。