App下載

html怎么插入視頻?視頻如何插入頁面

猿友 2021-03-17 12:00:06 瀏覽數(shù) (235103)
反饋

HTML 的功能強大,基本所有的靜態(tài)效果都可以在此輕松呈現(xiàn),各種視頻網(wǎng)站內(nèi)有大量的視頻內(nèi)容,本篇文章教你如何在 html 中插入視頻

代碼如下:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>video - 編程獅(w3cschool.cn)</title>
<style>
</style>
</head>
<body>
    <video width="320" height="240" controls>
        <source src="/statics/demosource/movie.mp4"  type="video/mp4">
        <source src="/statics/demosource/movie.ogg"  type="video/ogg">
        您的瀏覽器不支持 HTML5 video 標(biāo)簽。
    </video>
</body>
</html>

標(biāo)簽定義和使用說明

?<video>?標(biāo)簽定義視頻,類似電源片段和其他視頻流。

?<video>?目前為止支持三種視頻格式:Ogg、WebM、MP4

瀏覽器 MP4 WebM Ogg
Internet Explorer YES NO NO
Chrome YES YES YES
Firefox YES
從 Firefox 21 版本開始
Linux 系統(tǒng)從 Firefox 30 開始
YES YES
Safari YES NO NO
Opera YES
從 Opera 25 版本開始
YES YES

<video>可選屬性

屬性 描述
autoplay autoplay 如果出現(xiàn)該屬性,則視頻在就緒后馬上播放。
controls controls 如果出現(xiàn)該屬性,則向用戶顯示控件,比如播放按鈕。
height pixels 設(shè)置視頻播放器的高度。
loop loop 如果出現(xiàn)該屬性,則當(dāng)媒介文件完成播放后再次開始播放。
muted muted 如果出現(xiàn)該屬性,視頻的音頻輸出為靜音。
poster URL 規(guī)定視頻正在下載時顯示的圖像,直到用戶點擊播放按鈕。
preload auto
metadata
none
如果出現(xiàn)該屬性,則視頻在頁面加載時進行加載,并預(yù)備播放。如果使用 "autoplay",則忽略該屬性。
src URL 要播放的視頻的 URL。
width pixels 設(shè)置視頻播放器的寬度。

以上就是小編為您帶來的html中如何插入視頻的全部內(nèi)容。


2 人點贊