Html學習筆記7:嵌入音頻和視頻

HTML5的<video>元素不需要藉助flash插件就可以實現視頻播放,有以下常用屬性。
視頻的URL爲src,視頻的寬度width,視頻的高度height,autoplay設置後表示立刻開始播放視頻,preload設置後表示預先載入視頻,controls設置後表示顯示播放控件,loop設置後表示反覆播放視頻,muted設置後表示視頻處於靜音狀態,poster指定視頻數據載入時顯示的圖片。

其中的preload屬性有三個值:none表示什麼都不加載,metadata表示只能加載元數據(寬高、第一幀視頻等信息),auto表示請求瀏覽器儘快下載整個視頻。
用來嵌入音頻內容,屬性只有src,autoplay,preload,controls。用法都一樣。

    <!DOCTYPE html>  
    <html lang="zh-cn">  
    <head>  
        <title>音頻和視頻</title>  
        <meta charset="utf-8">  
    </head>  
    <body>  
        <!-- <video src="test.mp4" width="800" height="600" controls loop poster="tx.jpg" preload="auto"></video> -->  
        <video width="800" height="600" controls loop poster="tx.jpg" preload="auto">  
            <source src="test.webm">  
            <source src="test.mp4">  
            <source src="test.ogg">  
            <object>實現flash插件的播放,如果屏蔽IE9以下,則不需要</object>  
        </video>  
        <audio controls>  
            <source src="test.mp3">  
            <source src="test.m4a">  
            <source src="test.wav">  
        </audio>  
    </body>  
    </html>  

這裏寫圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章