技術コンテンツ

【HTML】videoタグ - 映像

【HTML】videoタグ - 映像

HTMLのvideoタグについて解説します。

検証環境

videoタグ

videoタグは“映像(動画)データを埋め込むタグ”です。

基本構文

<video controls src="映像データパス"></video>

映像データパスはURLや相対パスです。

属性

主な属性は次の通りです。

属性名 必須 内容
src 映像データパス
autoplay - 再生可能な状態になったら自動再生
controls - コントロール表示
loop - ループ
muted - ミュート

サンプル

コントロール表示

___ih_hl_start
<video controls src="https://it-hack.net/storage/app/media/document/development/markup-language/html/tag/video/beach.mov"></video>
___ih_hl_end

ループ

___ih_hl_start
<video controls loop src="https://it-hack.net/storage/app/media/document/development/markup-language/html/tag/video/beach.mov"></video>
___ih_hl_end

ミュート

___ih_hl_start
<video controls muted src="https://it-hack.net/storage/app/media/document/development/markup-language/html/tag/video/beach.mov"></video>
___ih_hl_end