<video> - ビデオ

トップ > HTMLリファレンス > <video>

■ 概要

項目説明
形式<video>〜</video>
サポートH5+ / e9+ / Fx3.5+ / Op10.5+ / Ch1+ / Sa3.1+
タグの省略開始タグ:必須、終了タグ:必須
包含可能要素source / ブロック要素 / インライン要素

■ 説明

ビデオファイルを再生します。

<video>〜</video> の間には、video未対応のブラウザに表示するメッセージを記述することができます。

ブラウザによってサポートするコーデックやフォーマットが異なるため、<source> を用いて複数のフォーマットを指定することも可能です。

■ 属性

【個別属性】
属性意味
autoplayH5+。自動的に再生を開始します。
controlsH5+。コントローラを表示します。
loopH5+。ループ再生します。
mediagroup=nameH5+。複数のメディアリソースをグルーピングする際のグループ名を指定します。
preload=valueH5+。ページ表示時にメディアリソースを事前ロードするか指定します。指定に従うかどうかはブラウザの実装にまかされます。
 auto:事前ロードする
 none:事前ロードしない
 metadata:メタデータのみを事前ロードする
autoplayが指定された場合は無視されます。
src=urlH5+。メディアリソースのURLを指定します。
height=nH5+。高さを指定します。
width=nH5+。横幅を指定します。
poster=urlH5+。ブラウザが表示可能な形式のビデオが無い場合に表示する画像ファイルのURLを指定します。
mutedH5+。音をミュートします。
crossorigin=stateH5+。CORS(Cross-Origin Resource Sharing)で使用される属性で、他のサイトのリソースにアクセスする際に、認証情報を使用するかどうかを指定します。
 anonymous:認証情報を使用しない
 use-credintials:認証情報を使用する

【一般属性】
属性意味
class=classH5+。クラスを指定します。
id=idH5+。IDを指定します。
style=styleH5+。スタイルシートを指定します。
title=titleH5+。タイトルを指定します。
dir=dirH5+。文字の表示方向を指定します。
lang=langH5+。言語を指定します。
accesskey=keyH5+。アクセスキーを指定します。
tabindex=nH5+。タブインデックスを指定します。
contenteditable=boolH5+。要素を編集可能にします。
contextmenu=idH5+。コンテキストメニューを指定します。
draggable=boolH5+。ドラッグを可能にします。
dropzone=valueH5+。ドロップを可能にします。
hiddenH5+。要素を非表示にします。
spellcheck=boolH5+。スペルをチェックします。

■ 使用例

HTMLソース
<video src="video.mpg" autoplay loop>
<p>このブラウザは video に未対応です。</p>
</video>

■ 関連項目

<audio><source><track>

Copyright (C) 2011-2012 杜甫々
初版:2011年6月11日 最終更新:2012年4月3日
http://www.tohoho-web.com/html/video.htm