html5的video（視訊）和audio（音訊）標籤中的屬性用法

這篇文章要跟大家介紹的內容是關於html5的video（影片）和audio（音訊）標籤中的屬性用法，有一定的參考價值，有需要的朋友可以參考一下，希望對你有所幫助。

如何在所有主流瀏覽器中啟用

要讓HTML5視訊和音訊標籤適用於所有主流瀏覽器，只需在文件的中的某處添加以下程式碼行即可。

<script src="//api.html5media.info/1.2.2/html5media.min.js"></script>

#如何嵌入影片

您可以使用以下程式碼將影片嵌入到您的頁面中。

<video src="video.mp4" width="320" height="200" controls preload></video>

#如何嵌入音訊

您可以使用以下程式碼將音訊嵌入到頁面中。

<audio src="audio.mp3" controls preload></audio>

影片格式: 
格式MIME-type 
MP4 video/mp4 
WebM video/webm 
Ogg video/ogg

HTML5 中的新屬性： 
屬性值描述 
autoplay autoplay 如果出現該屬性，則影片在就緒後馬上播放。 
controls controls 如果出現該屬性，則向使用者顯示控件，例如播放按鈕。 
height pixels 設定影片播放器的高度。 
loop loop 如果出現該屬性，則當媒介檔案完成播放後再次開始播放。 
muted muted 規定視訊的音訊輸出應該被靜音。
poster URL 規定影片下載時顯示的圖片，或在使用者點擊播放按鈕前顯示的圖片（ poster = 「 poster.jpg ”）。 
preload preload 如果出現該屬性，則影片在頁面載入時進行載入，並預備播放（預先載入）。 
如果使用 “autoplay”，則忽略該屬性。 
src url 要播放的影片的 URL。 
width pixels 設定視訊播放器的寬度。

HTML 音訊/視訊 方法: 
方法 說明 
addTextTrack() 新增音訊/視訊的新文字軌道。 
canPlayType() 偵測瀏覽器是否能播放指定的音訊/視訊類型。 
load() 重新載入音訊/視訊元素。 
play() 開始播放音訊/視訊。 
pause() 暫停目前播放的音訊/視訊。

可以透過 addEventListener 監聽影片的ended事件，監聽結束時間，進行結束，跳轉的動作等

相關文章推薦： 

#HTML5的option屬性：如何使用option屬性實現級聯下拉清單

#html5頁面結構的變化以及增加和刪除標籤的總結

以上是html5的video（視訊）和audio（音訊）標籤中的屬性用法的詳細內容。更多資訊請關注PHP中文網其他相關文章！