为什么会有样式定制？前面我们说了，直播流的播放/暂停逻辑与点播不同，因此我们要隐藏 video 的操作栏元素，通过自定义元素来实现相关功能。
首先要隐藏播放/暂停按钮，进度条，以及音量按钮，用 css 实现即可：
/* 所有控件 */
video::-webkit-media-controls-enclosure {
display: none;
}
/* 进度条 */
video::-webkit-media-controls-timeline {
display: none;
}
video::-webkit-media-controls-current-time-display {
display: none;
}
/* 音量按钮 */
video::-webkit-media-controls-mute-button {
display: none;
}
video::-webkit-media-controls-toggle-closed-captions-button {
display: none;
}
/* 音量的控制条 */
video::-webkit-media-controls-volume-slider {
display: none;
}
/* 播放按钮 */
video::-webkit-media-controls-play-button {
display: none;
}
播放和暂停的逻辑上面讲了，样式这边自定义一个按钮即可。除此之外我们还可能需要一个全屏按钮，看一下全屏的逻辑怎么写：
const fullPage = () => {
let dom = document.querySelector('.video')
if (dom.requestFullscreen) {
dom.requestFullscreen()
} else if (dom.webkitRequestFullScreen) {
dom.webkitRequestFullScreen()
}
}
其他自定义样式，比如你要做弹幕，在 video 上面盖一层元素自行实现就可以了。