html5 網頁播放器(一)

HTML5 是 W3C 與 WHATWG 合作的結果。
HTML5 建立的一些規則:

新特性應該基於 HTML、CSS、DOM 以及 JavaScript。 減少對外部插件的需求(比如 Flash) 更優秀的錯誤處理 更多取代腳本的標記 HTML5 應該獨立於設備 開發進程應對公衆透明
HTML5 中的一些有趣的新特性:用於繪畫的 canvas 元素 用於媒介回放的 video 和audio 元素 對本地離線存儲的更好的支持 新的特殊內容元素,比如 article、footer、header、nav、section 新的表單控件,比如 calendar、date、time、email、url、search
瀏覽器支持
最新版本的 Safari、Chrome、Firefox 以及 Opera 支持某些 HTML5 特性。Internet Explorer 9 將支持某些 HTML5 特性。
建立一個html頁面要區分html4,在html4中使用的規範是<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
html4 中的 doctype 需要引用一個 DTD,這是因爲 HTML 4.01 基於 SGML
而在html5中只需要:<!DOCTYPE>
第一個事列就是在瀏覽器裏播放vido,之前都是通過瀏覽器安裝Flash插件來播放,但是很多瀏覽器不支持。比如android系統上面,想在線看一段視頻但是android系統瀏覽器不支持flash,無法看,有了html5就不一樣了
要想在你的頁面播放視屏只需要加入<video>標籤就可以了比如
<video width="320" height="240" controls="controls">
<source src="movie.ogg" type="video/ogg">
<source src="movie.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
video標籤屬性就不用一個一個的說了。controls如果出現該屬性,則向用戶顯示控件,比如播放按鈕。autoplay如果出現該屬性,則視頻在就緒後馬上播放。loop如果出現該屬性,則當媒介文件完成播放後再次開始播放。
那要想播放音樂呢,使用<audio>標籤
事列
<audio src="song.ogg" controls="controls">
Your browser does not support the audio tag.
</audio>
audio標籤的屬性preload如果出現該屬性,則音頻在頁面加載時進行加載,並預備播放。
像視頻一樣。一個audio標籤中可以嵌套多個<source>表示是瀏覽器來匹配適合自己的格式。匹配上第一就播放。

附件提供html5.chm幫助,以及css3
發佈了1 篇原創文章 · 獲贊 0 · 訪問量 1332
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章