<audio>
<audio> は HTML の要素で、文書内に音声コンテンツを埋め込むために使用します。この要素は、1 つまたは複数の音源を含むことができます。音源は src 属性または <source> 要素を使用して表し、ブラウザーがもっとも適切な音源を選択します。 また、 MediaStream を使用してストリーミングメディアを指し示すこともできます。
対応ブラウザ
| 機能 | デスクトップ | モバイル | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| 3 | 12 | 3.5 | 3.1 | 18 | 3 | |
| HTML 属性 | ||||||
controls | 3 | 12 | 3.5 | 3.1 | 18 | 3 |
| crossorigin 属性は、audio, img, link, script, video の各要素で有効です。CORS への対応を提供し、したがって要素が読み取るデータのために CORS リクエストの構成を有効にします。要素によっては、属性は CORS 設定属性になります。 | 33 | ≤18 | 74 | 10 | 33 | 10 |
loop | 3 | 12 | 11 | 3.1 | 18 | 3 |
muted | 15 | ≤18 | 11 | 6 | 18 | 6 |
preload | 3 | 12 | 4 | 3.1 | 18 | 3 |
src | 3 | 12 | 3.5 | 3.1 | 18 | 3 |
| DOM API | ||||||
| HTMLAudioElement インターフェイスは audio 要素のプロパティと、操作するメソッドへのアクセスを提供します。 | 3 | 12 | 3.5 | 3.1 | 18 | 3 |
| Audio() コンストラクターは新しい HTMLAudioElement を作成し返します。この要素は文書に取り付けてユーザーが操作したり聞いたりすることができますし、画面外で音声を管理したり再生したりするために使用することもできます。 | 4 | 12 | 3.5 | 3.1 | 18 | 3 |
注釈 1件
実装メモ
- Firefoxがオーディオを再生するには、サーバーが正しいMIMEタイプを使ってファイルを提供する必要があります。
注釈 3件
制限事項
- このブラウザでは部分的にしか実装されていません
削除済み
- このバージョンで機能が削除されました (74)
実装メモ
- crossorigin="use-credentials"`を指定すると、シーク時にクッキーを送信しません。バグ 1532722 を参照してください。
注釈 1件
実装メモ
- Chrome 64のデフォルトは`metadata`である。
注釈 2件
削除済み
- このバージョンで機能が削除されました (4)
対応条件
- 以前は別名で対応していました: autobuffer (3.5)
注釈 1件
実装メモ
- Chrome Android 64のデフォルトは`metadata`である。
基本構文
HTML
<audio controls>
<source src="audio.mp3" type="audio/mpeg">
<source src="audio.ogg" type="audio/ogg">
Your browser does not support the audio element.
</audio>ライブデモ
Multiplefo-mat with Source element.
Multiple. audiofo-mat specified, browser that supportshape notation selection. with source
プレビュー全画面表示
実務での使いどころ
-
<audio> の活用
<audio> は HTML の要素で、文書内に音声コンテンツを埋め込むために使用します。
注意点
- 古いブラウザでは対応していない場合がある。
アクセシビリティ
- スクリーンリーダーでの読み上げを確認すること。