直到現在，仍然不存在一項旨在網頁上顯示視頻的標準

今天，大多數視頻是通過插件（比如 Flash）來顯示的。然而，並非所有瀏覽器都擁有同樣的插件

HTML5 規定了一種通過 video 元素來包含視頻的標準方法

實例 --->

<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
您的瀏覽器不支持 HTML5 video 標簽。
</video>

運行結果

<video> 元素提供了 播放、暫停和音量控件來控制視頻

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

<video> 與</video> 標簽之間插入的內容是提供給不支持 video 元素的瀏覽器顯示的

當前， <video> 元素支持三種視頻格式： MP4, WebM, 和 Ogg:

• MP4 = 帶有 H.264 視頻編碼和 AAC 音頻編碼的 MPEG 4 文件
• WebM = 帶有 VP8 視頻編碼和 Vorbis 音頻編碼的 WebM 文件
• Ogg = 帶有 Theora 視頻編碼和 Vorbis 音頻編碼的 Ogg 文件

HTML <video>　　　　使用dow進行控制

HTML5 <video> 和 <audio> 元素同樣擁有方法、屬性和事件

<video> 和 <audio>元素的方法、屬性和事件可以使用JavaScript進行控制

其中的方法用於播放、暫停以及加載等。其中的屬性（比如時長、音量等）可以被讀取或設置。其中的 DOM 事件能夠通知您，比方說，<video> 元素開始播放、已暫停，已停止，等等

例中簡單的方法，向我們演示了如何使用 <video> 元素，讀取並設置屬性，以及如何調用方法 --->

<div style="text-align:center"> 
  <button onclick="playPause()">播放/暫停</button> 
  <button onclick="makeBig()">放大</button>
  <button onclick="makeSmall()">縮小</button>
  <button onclick="makeNormal()">普通</button>
  <br> 
  <video id="video1" width="420">
    <source src="mov_bbb.mp4" type="video/mp4">
    <source src="mov_bbb.ogg" type="video/ogg">
    您的瀏覽器不支持 HTML5 video 標簽。
  </video>
</div> 

<script> 
var myVideo=document.getElementById("video1"); 

function playPause()
{ 
    if (myVideo.paused) 
      myVideo.play(); 
    else 
      myVideo.pause(); 
} 

    function makeBig()
{ 
    myVideo.width=560; 
} 

    function makeSmall()
{ 
    myVideo.width=320; 
} 

    function makeNormal()
{ 
    myVideo.width=420; 
} 
</script> 

上面的例子調用了兩個方法：play() 和 pause()。它同時使用了兩個屬性：paused 和 width

運行效果

16、HTML5 Video