近期谷歌瀏覽器宣布也不再支持flash插件，Hlml播放視頻學習很有必要
實例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>H5-03</title>
</head>
<body>
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
您的瀏覽器不支持 HTML5 video 標簽。
</video>
</body>
</html>
<video> 元素提供了 播放、暫停和音量控件來控制視頻。
同時<video> 元素元素也提供了 width和 height屬性控制視頻的尺寸.如果設(shè)置的高度和寬度，所需的視頻空間會在頁面加載時保留。如果沒有設(shè)置這些屬性，瀏覽器不知道大小的視頻，瀏覽器就不能再加載時保留特定的空間，頁面就會根據(jù)原始視頻的大小而改變。
<video>與 </video> 標簽之間插入的內(nèi)容是提供給不支持 video 元素的瀏覽器顯示的。<video>元素支持多個 <source> 元素。 <source> 元素可以鏈接不同的視頻文件。瀏覽器將使用第一個可識別的格式：
視頻格式與瀏覽器的支持
當前，<video> 元素支持三種視頻格式： MP4, WebM, 和 Ogg:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>H5-03</title>
</head>
<body>
<div style="text-align: center">
<button onclick ="payPause()">播放/暫停</button>
<button onclick ="makeBig()">放大</button>
<button onclick ="makeSmall()">縮小</button>
<button onclick ="makeNormal()">普通</button>
<br>
<video id="videoTest" width="420">
<source src="mov_bbb.mp4" type="video/mp4">
<source src="mov_bbb.ogg" type="video/ogg">
您的瀏覽器不支持 HTML5 video 標簽。
</video>
</div>
<script type="text/javascript">
var myvideo = document.getElementById("videoTest");
function payPause() {
// alert("test")
console.log(myvideo.paused);
if (myvideo.paused) {
myvideo.play();
} else {
myvideo.pause();
}
}
function makeBig() {
myvideo.width =560;
}
function makeSmall(){
myvideo.width=320;
}
function makeNormal(){
myvideo.width=420;
}
</script>
</body>
</html>
