站長(zhǎng)資訊網(wǎng)
最全最豐富的資訊網(wǎng)站

html5怎么嵌入視頻

html5怎么嵌入視頻

首先我們要知道HTML5是支持直接在瀏覽器中播放音頻和視頻文件的,不需要使用 adobe flash 插件。

插件缺點(diǎn):插件是令瀏覽器崩潰的主要原因之一,特別是 flash,存在著很多問題。

(視頻學(xué)習(xí)推薦:html5視頻教程)

在網(wǎng)頁(yè)中嵌入視頻要使用 video 元素。

一、<video> 標(biāo)簽

定義和用法

<video> 標(biāo)簽定義視頻,比如電影片段或者其他視頻流。

提示

可以在開始標(biāo)簽和結(jié)束標(biāo)簽之間放置文本內(nèi)容,這樣老的瀏覽器就可以顯示出不支持該標(biāo)簽的信息

屬性:

html5怎么嵌入視頻

舉例:

<!DOCTYPE HTML> <html> <body>   <video src="http://www.w3school.com.cn/i/movie.ogg" controls="controls"> 您的瀏覽器不支持 video 標(biāo)簽。 </video>   </body> </html>

html5怎么嵌入視頻

瀏覽器支持的視頻格式

html5怎么嵌入視頻

Ogg = 帶有 Theora 視頻編碼和 Vorbis 音頻編碼的 Ogg 文件

MPEG 4 = 帶有 H.264 視頻編碼和 ACC 音頻文件的 MPEG 4 文件

WebM = 帶有 VP8 視頻編碼和 Vorbis 音頻編碼的 WebM 文件

總結(jié):沒有任何一個(gè)格式可以支持所有的瀏覽器

最簡(jiǎn)單的方法,同時(shí)使用 Mp4 和 Ogv 兩種影音格式

二、<source> 標(biāo)簽

在 <video></video> 中間插入元素 source

source 元素用來設(shè)置視頻格式,包含屬性 src 和 type

舉例:

<video src='視頻1.mp4' heigth='500px' controls>   <source src='視頻2.mp4' type='video/mp4'>   <!-- 當(dāng)‘視頻1.mp4’無法播放時(shí),會(huì)跳轉(zhuǎn)到src='視頻2.mp4' -->   <source src='視頻2.ogv' type='video/ogg'>   <!-- 當(dāng)瀏覽器不支持MP4格式的視頻時(shí),會(huì)自動(dòng)找此處ogv格式的視頻 -->   <source src='視頻2.webm' type='video/webm'> </video>

這里提供了兩種可選的視頻格式 Mp4 和 Ogv。視頻鏈接現(xiàn)在不再是通過 video 元素的 src 屬性來給出,而是通過 source 元素單獨(dú)指出。source 元素允許我們指定多種可選格式的視頻文件,這樣當(dāng)瀏覽器不支持寫在前面的格式時(shí)可以選擇后面格式的視頻文件。

相關(guān)推薦:h5

贊(0)
分享到: 更多 (0)
網(wǎng)站地圖   滬ICP備18035694號(hào)-2    滬公網(wǎng)安備31011702889846號(hào)
日韩精品无码一区二区三区不卡 | 亚洲av午夜福利精品一区人妖 | 国产精品jizz在线观看网站| 久久精品国产亚洲AV香蕉| 精品国内在视频线2019| 91精品国产91久久久久| 亚洲av永久无码精品网站| 亚洲国产精品网站在线播放 | 中文字幕成人精品久久不卡| 日韩精品无码久久久久久| 久久亚洲精品中文字幕| 国产69精品久久久久APP下载 | 人人妻人人澡人人爽人人精品浪潮| 久热国产精品视频一区二区三区| 国产AV一区二区精品凹凸| 国产高清在线精品一区二区| 国产乱人伦偷精品视频| 国产精品福利电影| 日韩精品免费一级视频| 97久久超碰成人精品网站| 91视频国产精品| 99久久99久久精品免费看蜜桃| 青草热在线精品视频99app| 久久久这里有精品999| 国产日韩一区二区三区| 精品国产一区二区三区久久蜜臀| 99久久国产综合精品swag| 精品久久久无码人妻字幂| 精品国产热久久久福利| 亚洲精品乱码久久久久久蜜桃图片 | 色妞www精品视频一级下载| 日韩精品久久不卡中文字幕| 亚洲码国产精品高潮在线| 久久久久久国产精品无码超碰| 国产成人福利精品视频| 精品国产福利在线观看| 国内精品久久人妻互换| 人妻老妇乱子伦精品无码专区 | 日韩精品久久无码中文字幕| 免费精品国偷自产在线在线| 久久精品中文字幕免费|