項 目 | 説 明 |
---|---|
記述形式 | <source src="メディア・ファイル"> |
対応ブラウザー | H5+ / e9+ / Fx3.5+ / Op10.5+ / Ch1+ / Sa3.1+ |
種 類 (カテゴリー) |
なし |
置ける場所 | media要素(audio要素と video要素)の子要素 (フロー・コンテンツや track要素より前) |
内包要素 (コンテンツ・モデル) |
空 (コンテンツ・モデル: 空) |
<source> は,video要素や audio要素で再生するメディア・ファイルを指定するための要素です。
video要素や audio要素の src属性による指定では,1つのファイルのみですが,source要素を複数使用すれば,複数のメディア・ファイルが指定できます。 上から順番にチェックして,再生可能なファイルが見つかった時点でそのファイルを再生します。 この場合,それ以降の source要素によるファイルの指定は無視されます。
このような複数のメディア・ファイルを指定する理由は,現在のところ,ブラウザーによって対応するメディア・ファイルの形式が異なるためです。 1つのメディア・ファイルを指定しただけでは,再生できるブラウザーが限定されてしまいます。 そこで,あらかじめ各ブラウザーが対応する形式のファイルをそれぞれ用意して,それらをすべて source要素で指定しておくことで,多くのブラウザーに対応できます。
なお,video要素や audio要素に未対応のブラウザーへのフォールバック・コンテンツ(代替のコンテンツ)は,source要素の後に記述します。
種 類 | 名 称 |
---|---|
【固有属性】 | src, type, media |
【グローバル属性】 | accesskey,class,contenteditable *,
dir, hidden *,id, lang,spellcheck *,style, tabindex,title,translate * |
【ARIA role属性】 で 指定可能な値 (役割) |
なし |
【ARIA aria-* 属性】 で 指定可能なもの |
ARIA グローバル状態とプロパティ |
media属性の値 | 説 明 |
---|---|
screen | パソコンのモニタ画面 |
tty | 文字幅が固定の端末機器 |
tv | テレビ |
projection | プロジェクター |
handheld | 携帯機器 |
プリンター | |
braille | 点字ディスプレイ |
embossed | 点字プリンター |
aural | 音声出力 |
all | すべてのメディア |
種 類 | 名 称 |
---|---|
【よく使うもの】 |
HTMLソース | |
---|---|
HTML <body> ~ </body> |
<audio autoplay> <source src="xxx.mp3" type="audio/mp3"> <source src="xxx.wav" type="audio/wav"> <source src="xxx.ogg" type="audio/ogg"> <p>このブラウザーは audio要素に未対応です。</p> </audio> |