-
video
（是 HTML 5 中的新標籤）
鎖定
- 外文名
- video
- 標籤名
- video
- 出 處
- HTML5
- 作 用
- 在HTML頁面中嵌入視頻
- 兼容性
- IE 9+、Firefox、Chrome等
video瀏覽器兼容性
瀏覽器 | MP4 | WebM | Ogg |
|---|---|---|---|
Internet Explorer 9+ | Y | N | N |
Chrome 6+ | Y | Y | Y |
Firefox 3.6+ | Y | Y | Y |
Safari 5+ | Y | N | N |
Opera 10.6+ | N | Y | Y |
- MP4 = MPEG 4文件使用 H264 視頻編解碼器和AAC音頻編解碼器
- WebM = WebM 文件使用 VP8 視頻編解碼器和 Vorbis 音頻編解碼器
- Ogg = Ogg 文件使用 Theora 視頻編解碼器和 Vorbis音頻編解碼器
video支持的MIME 類型
格式 | MIME-type |
|---|---|
MP4 | video/mp4 |
WebM | video/webm |
Ogg | video/ogg |
video提示和註釋
譬如：以下代碼可以在瀏覽器不支持Video標籤時顯示文本，引導用户升級瀏覽器
<!DOCTYPE html> <html> <head> <title>Html Video example</title> </head> <body> <video src="test.mp4" controls> <h2>我們很抱歉，您的瀏覽器<strong>不支持video標籤</strong></h2> <a href="https://www.google.cn/chrome/">點擊這裏下載瀏覽器</a> </video> </body> </html>
video可選屬性
屬性 | 值 | 描述 | 備註 |
|---|---|---|---|
autoplay | autoplay | 如果出現該屬性，則視頻在就緒後馬上播放。 | 谷歌高版本瀏覽器不允許自動播放，除非設置muted屬性。 |
controls | controls | 如果出現該屬性，則向用户顯示控件，比如播放按鈕。 | 使用第三方播放器時，不添加該屬性，以便使用自定義控件 |
height | pixels | 設置視頻播放器的高度。 | 不建議使用，使用CSS替換 |
loop | loop | 如果出現該屬性，則當媒介文件完成播放後再次開始播放。 | 無 |
muted | muted | 如果出現該屬性，視頻的音頻輸出為靜音。 | 只有設置這個屬性視頻才會自動播放 |
poster | URL | 規定視頻正在下載時顯示的圖像，直到用户點擊播放按鈕。 | Poster建議分辨率：1280x720，以免在弱網環境下加載慢 |
preload | auto metadata none | 如果出現該屬性，則視頻在頁面加載時進行加載，並預備播放。如果使用 "autoplay"，則忽略該屬性。 | 無 |
src | URL | 要播放的視頻的 URL。 | 使用流媒體格式時，顯示blob:開頭的URL |
width | pixels | 設置視頻播放器的寬度。 | 不建議使用，使用CSS替換 |
video全局屬性
<video> 標籤支持HTML 的全局屬性。
[2]
video事件屬性
<video> 標籤支持HTML 的事件屬性。
- 參考資料
-
- 1. HTML 標籤 ．w3cschool．2014-01-25[引用日期2014-01-25]
- 2. HTML video標籤 ．W3Cschool[引用日期2017-11-17]
