【转】CSS_控制 video 标签的控制栏组件（隐藏、显示进度条、播放按钮、全屏按钮等）

// 当 video 标签添加上 controls 属性时，页面上会显示出所有的控制组件。若有些组件不需要只需要在css中设置相关属性把它隐藏掉即可。

<video controls></video>

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35

<br><br><br>//全屏按钮 video::-webkit-media-controls-fullscreen-button {     display: none; } //播放按钮 video::-webkit-media-controls-play-button {     display: none; } //进度条 video::-webkit-media-controls-timeline {     display: none; } //观看的当前时间 video::-webkit-media-controls-current-time-display{     display: none;            } //剩余时间 video::-webkit-media-controls-time-remaining-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-enclosure{     display: none; }