css修改video样式
<style>
//所有控件
video::-webkit-media-controls-enclosure {
display: none;//隐藏控件
//修改样式如下
background-color: brown;
width: 0;
height: 0;
}
// 全屏按钮
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;
}
</style>
该代码段展示了如何使用CSS来修改HTML5video元素的默认样式,包括隐藏控件如播放按钮、全屏按钮、进度条等,以及调整背景色和尺寸。
1414





