1.<video></video> 用於定義視頻,如影視片段 語法<video src="XXXmovie.mp4" controls></video> 支持視頻格式:mp4、ogg移動端、webM高清 常用屬性: src,視頻的地址url autoplay,視頻就緒後自動播放 controls,向 ...
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>