首頁 web前端 H5教程 html5聲頻audio和視訊video等新功能詳細說明_html5教學技巧

html5聲頻audio和視訊video等新功能詳細說明_html5教學技巧

May 16, 2016 pm 03:50 PM
audio video 影片

html5作為下一代web標準,年前軒起了html5熱潮。對於html5我只是本著了解看看。關於html5和RIA(silverlight,flash,JavaFx等)我不想說什麼,也沒有什麼好說的,存在就有其存在的理由。孰優孰劣,留給事實、時間來證明的。

在html5中出現了一些新特性
canvas 元素視訊video 和聲頻audio 元素;
對本地離線儲存(localStorage,sessionStorage)的支援;
對本地離線儲存(localStorage,sessionStorage)的支援;
對本地離線儲存(localStorage,sessionStorage)的支援;
對本地離線儲存(localStorage,sessionStorage)的支援;
對本地離線儲存(localStorage,sessionStorage)的支援; >新增特殊內容元素:article、footer、header、nav、section ;
新增表單控制項: calendar、date、time、email、url、search 。

属性 描述
autoplay autoplay 如果出现该属性,则视频在就绪后马上播放。
controls controls 如果出现该属性,则向用户显示控件,比如播放按钮。
height 像素 设置视频播放器的高度。
loop loop 如果出现该属性,则当媒介文件完成播放后再次开始播放。
preload preload

如果出现该属性,则视频在页面加载时进行加载,并预备播放。

如果使用 "autoplay",则忽略该属性。

src url视频地址 要播放的视频的 URL。
width 像素 设置视频播放器的宽度。

autobuffer

Autobuffer

(自动缓冲)

在网页显示时,该二进制属性表示是由用户代理(浏览器)自动缓冲的内容,还是由用户使用相关API进行内容缓冲

poster

url图片地址

 

当视频未响应或缓冲不足时,该属性值链接到一个图像。该图像将以一定比例被显示出来

今天看看視頻和聲音頻率:在html5中規定了視頻的標準方法:video
我們也可以設定多個source,瀏覽器會為我們選擇第一個可辨識的影片來播放,形狀:video屬性有:
在HTML5 規定了聲頻標準為 audio 元素,audio 元素能夠播放聲音檔案或音訊串流。

audio格式和video相似:直接行多source
複製程式碼


複製程式碼


如下:
其屬性比video少了height、width、poster。在我們的開發中多媒體越來越重要,html5出現了這些video和audio。
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱門文章

倉庫:如何復興隊友
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
1 週前 By 尊渡假赌尊渡假赌尊渡假赌

熱門文章

倉庫:如何復興隊友
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
1 週前 By 尊渡假赌尊渡假赌尊渡假赌

熱門文章標籤

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

抖音發布他人影片侵權嗎?它怎麼剪輯影片不算侵權? 抖音發布他人影片侵權嗎?它怎麼剪輯影片不算侵權? Mar 21, 2024 pm 05:57 PM

抖音發布他人影片侵權嗎?它怎麼剪輯影片不算侵權?

抖音發布影片如何賺收益?新手小白怎麼在抖音上賺錢啊? 抖音發布影片如何賺收益?新手小白怎麼在抖音上賺錢啊? Mar 21, 2024 pm 08:17 PM

抖音發布影片如何賺收益?新手小白怎麼在抖音上賺錢啊?

如何發布小紅書影片作品?發影片要注意什麼? 如何發布小紅書影片作品?發影片要注意什麼? Mar 23, 2024 pm 08:50 PM

如何發布小紅書影片作品?發影片要注意什麼?

微博發影片怎麼不壓縮畫質_微博發影片不壓縮畫質方法 微博發影片怎麼不壓縮畫質_微博發影片不壓縮畫質方法 Mar 30, 2024 pm 12:26 PM

微博發影片怎麼不壓縮畫質_微博發影片不壓縮畫質方法

飛傲CP13卡帶播放器上市,透明復古外觀 飛傲CP13卡帶播放器上市,透明復古外觀 Jun 16, 2024 am 09:52 AM

飛傲CP13卡帶播放器上市,透明復古外觀

如何把ppt影片嵌入到幻燈片文稿中合成一個文件 如何把ppt影片嵌入到幻燈片文稿中合成一個文件 Mar 20, 2024 am 11:30 AM

如何把ppt影片嵌入到幻燈片文稿中合成一個文件

Klipsch 推出 Flexus Core 300 旗艦條形音箱,支援 8K、12 個揚聲器和房間校正 Klipsch 推出 Flexus Core 300 旗艦條形音箱,支援 8K、12 個揚聲器和房間校正 Sep 05, 2024 am 10:16 AM

Klipsch 推出 Flexus Core 300 旗艦條形音箱,支援 8K、12 個揚聲器和房間校正

百度網盤的影片怎麼下載到手機相簿 影片儲存到手機相簿的方法 百度網盤的影片怎麼下載到手機相簿 影片儲存到手機相簿的方法 Mar 13, 2024 am 09:34 AM

百度網盤的影片怎麼下載到手機相簿 影片儲存到手機相簿的方法

See all articles