1. 程式人生 > >HTML5-Y音頻與視頻

HTML5-Y音頻與視頻

auto src 3.0 .org 控制器 http oop 標簽 10.6

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>音頻與視頻</title>
</head>
<body>
<!--audio標簽控制音頻視頻的 加了controls後瀏覽器裏會出現音頻播放器的控制器-->
<!--autoplay頁面打開後自動播放 loop循壞播放 2表示循壞2次-->
<!--各個瀏覽器對音頻的兼容問題:IE支持mp3、火狐支持oggvorbis/wav、chrome支持oggvorbis/wav、
opera支持oggvorbis/wav、safari支持mp3/wav。-->
<!--這樣的寫法瀏覽器就能自己找到相匹配的音頻 頁面只出現一個-->
<audio controls autoplay loop="3">
<sourse src="../see you again.mp3"></sourse>
<sourse src="../see you again.wav"></sourse>
<sourse src="../see you again.ogg"></sourse>
這句話在瀏覽器中會顯示比如IE某款都不支持就出現了這句話讓客戶看到了

<video width="100" controls autoplay loop="2">
<!--在指定視頻寬高是 控制條沒有改變大小 所以只設置width就好了-->
<sourse src="!!!!!!.mp4"></sourse>
<sourse src="!!!!!!.ogg"></sourse>
<sourse src="!!!!!!.wenm"></sourse>
</video>
<!--IE9開始支持mp4/火狐3.5開始支持ogg、4.0開始支持webm/opera10.5開始支持ogg、10.6開始支持webm/
chrome5.0開始支持mp4和ogg、6.0開始支持webm/safari3.0開始支持mp4。-->
<!--想達到各個瀏覽器兼容和音頻一樣-->
</audio>
</body>
</html>

HTML5-Y音頻與視頻