WEB前端第七課——視訊、音訊、圖形
1.<video></video>
用於定義視訊，如影視片段
語法<video src="XXXmovie.mp4" controls></video>
支援視訊格式：mp4、ogg移動端、webM高清
常用屬性：
src，視訊的地址url
autoplay，視訊就緒後自動播放
controls，向用戶顯示播放器控制元件
width，設定視訊的播放器的寬度
height，設定視訊的播放器的高度
loop，定義自動迴圈播放，預設無限迴圈，屬性值可設定次數
muted，定義音訊輸出預設為靜音
poster，設定視訊下載時顯示的影象，或在使用者點選播放按鈕前顯示的影象，值為url
preload，視訊在頁面載入時進行加在，並預備播放，如果使用“autoplay”則忽略該屬性
2.<audio></audio>
用於定義聲音，如音樂
語法<audio src="xxxmusic.mp3" autoplay></audio>
支援音訊格式：mp3、ogg、wav
常用屬性與video類似
src，視訊的地址url
autoplay，視訊就緒後自動播放
controls，向用戶顯示播放器控制元件
loop，定義自動迴圈播放，預設無限迴圈，屬性值可設定次數
muted，定義音訊輸出預設為靜音
preload，視訊在頁面載入時進行加在，並預備播放，如果使用“autoplay”則忽略該屬性
3.<source></source>
為媒介元素（如<video>和<audio>）定義媒介資源
<source>允許設定可替換的視訊/音訊檔案，供瀏覽器根據它對媒體型別或編碼器的支援進行選擇
語法示例：
<audio>
<source src="Getit.ogg">
<source src="Getit.mp3">
</audio>
4.<embed/>
用於定義嵌入的內容，如外掛，也可以用了嵌入聲音
語法<embed src=""/>，必須設定src屬性
5.<canvas></canvas>
canvas是一個容器（畫布），可以通過控制座標在canvas上繪製圖形，一般配合js使用能實現非常複雜的動畫效果
canvas擁有多種繪製路徑、矩形、圓形等，可以控制區域內每一個畫素
語法示例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>畫布測試</title>
<!-- 通過css設定背景顏色 -->
<style type="text/css">
canvas{
background-color: aliceblue;
}
</style>
</head>
<body>
<!--建立畫布，預設為無色填充的一個矩形區域-->
<canvas id="canvastest" width="600" height="600">
您的瀏覽器版本過低，不支援canvas！
</canvas>
</body>
</html>