HTML5 中如何嵌入視頻？

精華

Dad_WS 2016-11-21 15:32:46 瀏覽(10602) 回復(fù)(4) 贊(0)

如何使用HTML5嵌入視頻？

標(biāo)簽： html5

回答(4)

李大寶兒精華 2016-11-21

和音頻類(lèi)似，HTML5 支持 MP4、WebM 和 Ogg 格式的視頻，下面是簡(jiǎn)單示例：

<video width=”450″ height=”340″ controls>
  <source src=”W3Cschool.mp4″ type=”video/mp4″>
   Your browser does’nt support video embedding feature.
</video>

目前的 HTML5 規(guī)范草案還沒(méi)有指定瀏覽器應(yīng)該在 video 標(biāo)簽中支持哪種視頻格式。但是最常用的視頻格式是：

Ogg：帶有 Thedora 視頻編碼器和 Vorbis 音頻編碼器的 Ogg 文件。
mpeg4：帶有 H.264 視頻編碼器和 AAC 音頻編碼器的 MPEG4 文件。

我們可以使用帶有媒體類(lèi)型和其他屬性的標(biāo)簽指定媒體文件。video 元素允許使用多個(gè) source 元素，瀏覽器會(huì)使用第一個(gè)認(rèn)可的格式：

<!DOCTYPE HTML>  
<html>  
<body>  
   <video  width="300" height="200" controls autoplay>  
       <source src="/html5/W3Cschool.ogg" type="video/ogg" />  
       <source src="/html5/W3Cschool.mp4" type="video/mp4" />  
       Your browser does not support the <video> element.   
   </video>  
</body>  
</html>

Video 屬性規(guī)范

HTML5 video 標(biāo)簽可以使用多個(gè)屬性控制外觀和感覺(jué)以及各種控制功能：