最終更新日 
audio要素
audio要素は、音声データをドキュメントで再生できるようにするための「メディア要素」です。要素内のコンテンツは主にaudio要素に対応していない古いブラウザ用で、古い音声プラグインがそのコンテンツを使ったり、またはユーザーのためのテキスト情報を含めたりすることができます。
audio要素のsrc属性、preload属性、autoplay属性、loop属性、controls属性、muted属性、mediagroup属性については、video要素と共通です。
audio要素は、Embeddedコンテンツの記述箇所で使用できます。
audio要素内に別のメディア要素を含むことはできません。
HTML5での変更点
・audio要素は、HTML5で追加された新しい要素です。
| カテゴリ | タグの省略 | 親要素 | 子要素 |
|---|---|---|---|
|
Flowコンテンツ Phrasingコンテンツ Embeddedコンテンツ (Interactiveコンテンツ) |
省略不可 | Embeddedコンテンツを子にできる要素 |
src属性あり：track、Transparent src属性なし：source、track、Transparent |
| 属性 | 値 | 説明 |
|---|---|---|
| src | URL | 音声ファイルのURLを指定します。 |
| crossorigin | anonymous use-credentials |
要素の取得したデータに関わるCORS(Cross Origin Resource Sharing)リクエストを設定します。値には、anonymous(認証不要)、use-credentials(認証が必要)のいずれかを指定します。属性が指定されていない場合、CORSは利用されません。 |
| preload | none metadata auto |
音声ファイルに関する情報を「none」「metadata」「auto」のいずれかのキーワードで指定します。 |
| autoplay | autoplay | 論理属性。音声を自動再生させたい場合に指定します。 |
| mediagroup | 文字列 | 複数のメディア要素でメディアグループを作る際のグループ名を指定します。 |
| loop | loop | 論理属性。音声を繰り返し再生させたい場合に指定します。 |
| muted | muted | 論理属性。初期の音量を消音に設定します。 |
| controls | controls | 論理属性。ブラウザによるコントロール機能を使う場合に指定します。 |
| グローバル属性 | - | - |
| イベント属性 | - | - |
サンプルコード
<body>
<audio src="sample.mp3" autoplay controls>
<p>ご利用の環境では音声を再生できません。</p>
<p><a href="sample.mp3">右クリックで音声ファイルを保存して下さい。</a></p>
</audio>
</body>
当サイトの活動をサポートしてみませんか？気軽にクリエイターの支援ができます。