html5聲頻audio和視頻video等新特性詳細(xì)說(shuō)明

字號(hào):


    html5作為下一代web標(biāo)準(zhǔn),年前軒起了html5熱潮。對(duì)于html5我只是本著了解看看。關(guān)于html5和RIA(silverlight,flash,JavaFx等)我不想說(shuō)什么,也沒(méi)有什么可說(shuō)的,存在就有其存在的理由。孰優(yōu)孰劣,留給事實(shí)、時(shí)間來(lái)證明的。
    在html5中出現(xiàn)了一些新特性:
    canvas 元素 視頻 video 和 聲頻audio 元素 ;
    對(duì)本地離線存儲(chǔ)(localStorage,sessionStorage)的支持 ;
    新增特殊內(nèi)容元素:article、footer、header、nav、section ;
    新增表單控件: calendar、date、time、email、url、search 。
    今天看看視頻和聲頻:在html5中規(guī)定了視頻的標(biāo)準(zhǔn)方法:video
    <video src="xxx.ogg" controls="controls">你的瀏覽器還不支持哦</video> 我們也可以設(shè)置多個(gè)source,瀏覽器會(huì)為我們選擇第一個(gè)可識(shí)別的視頻來(lái)播放,形如:<video width="320" height="240" controls="controls"> <source src="xxx.ogg" type="video/ogg"> <source src="xx1.mp4" type="video/mp4">你的瀏覽器還不支持哦</video>video屬性有:
    
屬性 描述
autoplay autoplay 如果出現(xiàn)該屬性,則視頻在就緒后馬上播放。
controls controls 如果出現(xiàn)該屬性,則向用戶顯示控件,比如播放按鈕。
height 像素 設(shè)置視頻播放器的高度。
loop loop 如果出現(xiàn)該屬性,則當(dāng)媒介文件完成播放后再次開(kāi)始播放。
preload preload 如果出現(xiàn)該屬性,則視頻在頁(yè)面加載時(shí)進(jìn)行加載,并預(yù)備播放。
如果使用 "autoplay",則忽略該屬性。
src url視頻地址 要播放的視頻的 URL。
width 像素 設(shè)置視頻播放器的寬度。
autobuffer Autobuffer 在網(wǎng)頁(yè)顯示時(shí),該二進(jìn)制屬性表示是由用戶代理(瀏覽器)自動(dòng)緩沖的內(nèi)容,還是由用戶使用相關(guān)API進(jìn)行內(nèi)容緩沖
(自動(dòng)緩沖)
poster url圖片地址  
當(dāng)視頻未響應(yīng)或緩沖不足時(shí),該屬性值鏈接到一個(gè)圖像。該圖像將以一定比例被顯示出來(lái)

    在HTML5 規(guī)定了聲頻標(biāo)準(zhǔn)為 audio 元素,audio 元素能夠播放聲音文件或者音頻流。
    audio格式和video相似:直接行多source:
    代碼如下:
    <audio controls="controls">
    <source src="xx.ogg" type="audio/ogg">
    <source src="xx1.mp3" type="audio/mpeg">
    你的瀏覽器還不支持哦
    </audio>其屬性比video少了height、width、poster。在我們的開(kāi)發(fā)中多媒體越來(lái)越重要,html5出現(xiàn)了這些video和audio。