我們來看一下 video 的內部構造：
chrome 下，開發者工具 setting preferences elements 勾選 "show user agent shadow dom"
再回來看，已經可以看到 video 的內部結構了
瞄一眼，有沒有看到很熟悉的 -webkit-media-controls-fullscreen-button ？
通過video::-webkit-media-controls-fullscreen-button或者*::-webkit-media-controls-fullscreen-button就能控制全屏按鈕的樣式，其他按鈕是一樣的。
怎麼辦？有兩種方式：
1. controlslist
就這麼簡單？當然不是。。。這種方式需要 chrome 58+ 才支援，不能用於生產環境
2. overflow: hidden
video::-webkit-media-controls-enclosure
video::-webkit-media-controls-panel
就是將控制條面板設的長一些，超出的隱藏。。。這種方式還是勉強可以用於生產環境的，因為沒有別的更好的辦法。。。
Video標籤的基本使用
video 是html5新增的方法，關於其他的相信大家也很清楚了！好了廢話不多說 以下是我遇到的一些的方法 以下是一些屬性 volume 音量的大小 html box video left movies movie01.mp4 video 下面的控制器 controls play fa fa pla...
embed標籤和video的使用
屬性 值 描述 autoplay 屬性 autoplay autoplay controls 屬性 controls controls height 屬性 height pixels loop 屬性 loop loop muted 屬性 muted muted poster 屬性 poster ur...
設定video標籤的預設樣式
使用chrome除錯，如下圖，在setting裡勾選框中選項 可以看到video標籤的控制欄dom結構，如下圖，修改對應的樣式即可 全屏按鈕 video webkit media controls fullscreen button video webkit media controls play ...