HTML5視頻video,html5video

來源:互聯網
上載者:User

HTML5視頻video,html5video
直到現在,仍然不存在一項旨在網頁上顯示視頻的標準。
目前,大多數視頻是通過外掛程式(比如 Flash)來顯示的。然而,並非所有瀏覽器都擁有同樣的外掛程式。
HTML5 規定了一種通過 video 元素來包含視頻的標準方法。
當前HTML5隻支援三種格式的視頻。

格式 IE Firefox Opera Chrome Safari
Ogg No 3.5+ 10.5+ 5.0+ No
MPEG 4 9.0+ No No 5.0+ 3.0+
WebM No 4.0+ 10.6+ 6.0+ No
註:
Ogg = 帶有 Theora 視頻編碼和 Vorbis 音頻編碼的 Ogg 檔案
MPEG4 = 帶有 H.264 視頻編碼和 AAC 音頻編碼的 MPEG 4 檔案
WebM = 帶有 VP8 視頻編碼和 Vorbis 音頻編碼的 WebM 檔案
開發例子源碼如下
<!DOCTYPE HTML><html><body><video width="320" height="240" controls="controls"><source src="movie.ogg" type="http://www.w3school.com.cn/i/movie.ogg">    <source src="movie.mp4" type="http://www.w3school.com.cn/i/movie.mp4">你的瀏覽器不支援html5的video標籤</video></body></html>
解釋:
1、control 屬性供添加播放、暫停和音量控制項。
2、<video> 與 </video> 之間插入的內容是供不支援 video 元素的瀏覽器顯示的。
3、video 元素允許多個 source 元素。source 元素可以連結不同的視頻檔案。瀏覽器將使用第一個可識別的格式
支援的部分屬性列舉
屬性 描述
autoplay autoplay 如果出現該屬性,則視頻在就緒後馬上播放。
controls controls 如果出現該屬性,則向使用者顯示控制項,比如播放按鈕。
height pixels 設定視頻播放器的高度。
loop loop 如果出現該屬性,則當媒介檔案完成播放後再次開始播放。
preload preload

如果出現該屬性,則視頻在頁面載入時進行載入,並預備播放。

如果使用 "autoplay",則忽略該屬性。

src url 要播放的視頻的 URL。
width pixels 設定視頻播放器的寬度。

歡迎大家關注我的部落格!如有疑問,請加QQ群:135430763共同學習!

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.