HTMLのsourceタグに関する解説
sourceタグの定義と使用説明
<source>タグはHTMLのメディア要素に関連するタグであり、音声やビデオファイルの異なるフォーマットを提供するために使用されます。 主に<audio>や<video>タグと一緒に使用されます。 このタグによって、ブラウザがサポートしているフォーマットに応じて最適なメディアファイルを選択します。
ブラウザのサポート程度
<source>タグは、主要な現代ブラウザで広くサポートされています。 以下の表に、主要ブラウザのサポート状況を示します。
| ブラウザ | サポート状況 |
|---|---|
| Google Chrome | サポート有 |
| Mozilla Firefox | サポート有 |
| Safari | サポート有 |
| Microsoft Edge | サポート有 |
| Internet Explorer | バージョン9以降でサポート |
対応する属性とタグのイベント
<source>タグは以下の属性をサポートします：
- src: メディアファイルのURLを指定します。
- type: メディアファイルのMIMEタイプを指定します。例えば、
video/mp4やaudio/mpegなどが使用されます。 - media: メディアクエリを使用して、特定のデバイスや条件に適したメディアファイルを指定します。
sourceタグ自体にはイベントがありませんが、音声やビデオタグに関連するイベントを発生させることができます。
コード例
以下は<source>タグを使用したHTMLのサンプルです。
<video controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
お使いのブラウザは、ビデオタグをサポートしていません。
</video>Q&A
Q1: sourceタグはどのような場合に使用しますか？
A1: sourceタグは、異なるフォーマットのメディアファイルを提供する際に使用され、ブラウザがサポートするフォーマットに応じて最適なファイルを選択します。
Q2: sourceタグにイベントを設定できますか？
A2: sourceタグ自体にはイベントを設定できませんが、関連するaudioやvideoタグにイベントを設定することができます。
Q3: sourceタグのtype属性は必須ですか？
A3: type属性は必須ではありませんが、ブラウザが適切なメディアファイルを特定するために指定することが推奨されます。