source要素

source要素はHTML5から新たに追加された要素です。
picture要素や、audio要素、video要素に対し、複数のリソースを指定する場合に用います。

使用例

後述するコード断片は、次に列挙するリストの順にリソースの埋め込みを試みる使用例です。

1. webm形式の埋め込みを試みる
2. webm形式に対応していない環境だった場合、ogg形式の埋め込みを試みる
3. ogg形式に対応していない環境だった場合、mov形式の埋め込みを試みる
4. mov形式に対応していない環境だった場合、mp4形式の埋め込みを試みる
5. mp4形式に対応していない環境だった場合、代替テキストを表示する

<video controls>

<source src="dummy.webm" type="video/webm">

<source src="dummy.ogg" type="video/ogg">

<source src="dummy.mov" type="video/mov">

<source src="dummy.mp4" type="video/mp4">

<track kind="subtitles" src="dummy.en.vtt" srclang="ja" lang="en" label="Japanese">

<track kind="subtitles" src="dummy.en.vtt" srclang="en" lang="en" label="English">

<track kind="subtitles" src="dummy.fr.vtt" srclang="fr" lang="en" label="French">

<track kind="subtitles" src="dummy.de.vtt" srclang="de" lang="en" label="German">

<p>video要素がサポートされているブラウザで閲覧してください。</p>

</video>

使用可能な属性

• すべてのグローバル属性
• src
• type
• srcset
• sizes
• media

コンテンツカテゴリ

• なし

子要素にしていい要素の種類

• 空要素のため子要素は存在しません

親要素にしていい要素の種類

• picture要素
  • ただし、img要素の前
• メディア要素（audio要素やvideo要素）
  • ただし、任意のフローコンテンツまたはtrack要素の前

仕様書と策定状況