HTML5多媒體audio和video的示例用法

這篇文章將為大家詳細(xì)講解有關(guān)HTML5多媒體audio和video的示例用法，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。

目前創(chuàng)新互聯(lián)已為上千多家的企業(yè)提供了網(wǎng)站建設(shè)、域名、虛擬主機、網(wǎng)站托管維護(hù)、企業(yè)網(wǎng)站設(shè)計、新民網(wǎng)站維護(hù)等服務(wù)，公司將堅持客戶導(dǎo)向、應(yīng)用為本的策略，正道將秉承"和諧、參與、激情"的文化，與客戶和合作伙伴齊心協(xié)力一起成長，共同發(fā)展。

通常瀏覽器通過安裝flash來實現(xiàn)網(wǎng)頁音視頻的播放。
HTML5新增了audio和video元素來進(jìn)行音視頻的播放，從而減少了對flash的依賴。

audio對音頻的支持

HTML5 規(guī)定了一種通過 audio 元素來包含音頻的標(biāo)準(zhǔn)方法。
目前audio元素支持以下三種音頻格式：

音頻格式IE9Firefox 3.5Opera 10.5Chrome 3.0Safari 3.0
Ogg VorbisNOYESYESYESNO
MP3YESNONOYESYES
WavNOYESYESNOYES

video對視頻的支持

HTML5 規(guī)定了一種通過 video 元素來包含視頻的標(biāo)準(zhǔn)方法。
目前video元素支持以下三種視頻格式：

格式IEFirefoxOperaChromeSafari
OggNo3.5+10.5+5.0+No
MPEG 49.0+NoNo5.0+3.0+
WebMNo4.0+10.6+6.0+No

audio和video播放音視頻實例

<!Doctype html>
<html>
<head>
<title>HTML5多媒體</title>
<meta charset="utf-8"/>
</head>
<body>
    <p>
        <audio id="myAudio" controls="controls">
            <source src="resource/傳奇.mp3" type="audio/mpeg">
            您的瀏覽器不支持audio        
            </audio>
    </p>

    <p>
        <video id="myVideo" controls="controls">
            <source src="resource/手語.mp4" type="video/mp4">
            您的瀏覽器不支持video        
            </video>
    </p>
    </body>
    </html>

上面是最簡單的播放音頻和視頻的示例代碼，當(dāng)然mp3和mp4資源文件要自己找啦~
下面是我的示例代碼運行效果，音頻和視頻都播放起來了！
HTML5多媒體audio和video的示例用法

關(guān)于“HTML5多媒體audio和video的示例用法”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，使各位可以學(xué)到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。

網(wǎng)頁名稱：HTML5多媒體audio和video的示例用法
網(wǎng)頁URL：http://bm7419.com/article46/igsgeg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供外貿(mào)建站、全網(wǎng)營銷推廣、微信小程序、App開發(fā)、品牌網(wǎng)站設(shè)計、網(wǎng)站建設(shè)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)

成都做網(wǎng)站