使用chrome調試,如下圖,在setting里勾選框中選項
可以看到video標簽的控制欄dom結構,如下圖,修改對應的樣式即可
//全屏按鈕
video::-webkit-media-controls-fullscreen-button {
// display: none;
}
//播放按鈕
video::-webkit-media-controls-play-button {
}
//進度條
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;
}
多媒體事件(Media Events)
通過視頻(videos),圖像(images)或者音頻(audio) 觸發該事件,多應用於HTML媒體元素比如 <audio>, <embed>, <img>, <object>, 和<video>):
原文鏈接:https://blog.csdn.net/danruwang/java/article/details/96111753