HTML5?Video(影片)

Web網(wǎng)站上的影片

#直到現(xiàn)在，仍然不存在一項(xiàng)旨在網(wǎng)頁上顯示視訊的標(biāo)準(zhǔn)。

今天，大多數(shù)影片是透過外掛程式（例如 Flash）來顯示的。然而，並非所有瀏覽器都擁有相同的插件。

HTML5 規(guī)定了一種透過 video 元素來包含影片的標(biāo)準(zhǔn)方法。

HTML5 (視頻)- 如何運(yùn)作

如需在HTML5 中顯示視頻，您所有需要的是：

實(shí)例

<video width="320" height="240" controls>
  <source src="視頻文件名稱" type="視頻格式">
  <source src="視頻文件名稱" type="視頻格式">
您的瀏覽器不支持Video標(biāo)簽。
</video>

autoplay 屬性

實(shí)例

#設(shè)定為自動(dòng)播放的video 元素：

<video controls="controls" autoplay="autoplay"> 
 <source src="視頻文件名稱" type="視頻格式"> 
  <source src="視頻文件名稱" type="視頻格式">
您的瀏覽器不支持Video標(biāo)簽。
</video>

#controls： ? ?如果出現(xiàn)該屬性，則向使用者顯示控件，例如播放按鈕。 ? ?

<video> 元素提供了 播放、暫停和音量控制來控制影片。

同時(shí)<video> 元素元素也提供了 width 和 height 屬性控制影片的尺寸.如果設(shè)定的高度和寬度，所需的影片空間會(huì)在頁面載入時(shí)保留。 。如果沒有設(shè)定這些屬性，瀏覽器不知道大小的視頻，瀏覽器就不能再加載時(shí)保留特定的空間，頁面就會(huì)根據(jù)原始視頻的大小而改變。

<video> 與</video> 標(biāo)籤之間插入的內(nèi)容是提供給不支援 video 元素的瀏覽器顯示的。

<video> 元素支援多個(gè) <source> 元素. <source> 元素可以連結(jié)不同的視訊檔案。

影片格式與瀏覽器的支援

目前， <video> 元素支援三種影片格式： MP4, WebM, 和Ogg:

瀏覽器? ? ? ? ? ? ? ? ? ? MP4 ? ? ? ? ? ? ?WebM ? ? ? 1# ?? ? ? ? ? ? ? ? ? NO ? ? ? ? ? ? ? ? ? ? ?NO ? ?# #c?? ? ? YES ? ? ? ? ? ? ? ? ? ? ?YES ? ?

#Firefox ? ? ? ??YES ? ? ? ? ? ? ? ? ? ? ?YES ? ?

Safari ? ? ? ? ? ? ? ? ? ? ?YES ? ? ? ? ? ? ? ? ? NO ? ? ? ? ? ? ? ? ? ? ?NO ? ?

Opera ? ? ? YES (從Opera 25 起) ? ? ?YES ? ? ? ? ? ? ? ? ? ? ?YES ? ?

MP4 = 帶有H.264 視頻編碼和AAC 音頻編碼的MPEG 4檔案

WebM = 帶有VP8 視訊編碼和Vorbis 音訊編碼的WebM 檔案

Ogg = 帶有Theora 視訊編碼和Vorbis 音訊編碼的Ogg 檔案