您當前位置：首頁 > 互聯網 > HTML 5 視頻使用

HTML 5 視頻使用

來源：程序員人生發布時間：2014-11-04 08:07:50 閱讀次數：3963次

視頻格式

當前，video 元素支持3種視頻格式：

格式	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 文件

<video> 標簽的屬性

屬性	值	描寫
autoplay	autoplay	如果出現該屬性，則視頻在就緒后馬上播放。
controls	controls	如果出現該屬性，則向用戶顯示控件，比如播放按鈕。
height	pixels	設置視頻播放器的高度。
loop	loop	如果出現該屬性，則當媒介文件完成播放后再次開始播放。
preload	preload	如果出現該屬性，則視頻在頁面加載時進行加載，并豫備播放。如果使用 "autoplay"，則疏忽該屬性。
src	url	要播放的視頻的 URL。
width	pixels	設置視頻播放器的寬度。

實例1

<span style="font-family:SimHei;font-size:18px;"><video src="movie.ogg" width="320" height="240" controls="controls"> Your browser does not support the video tag. </video></span>

<video> 與 </video> 之間插入的內容是供不支持 video 元素的閱讀器顯示的。

control 屬性供添加播放、暫停和音量控件。

實例2

<span style="font-family:SimHei;font-size:18px;"><video width="320" height="240" controls="controls"> <source src="movie.ogg" type="video/ogg"> <source src="movie.mp4" type="video/mp4"> Your browser does not support the video tag. </video></span>

video 元素允許多個 source 元素。source 元素可以鏈接不同的視頻文件。閱讀器將使用第1個可辨認的格式。

生活不易，碼農辛苦
如果您覺得本網站對您的學習有所幫助,可以手機掃描二維碼進行捐贈
程序員人生