HTMLオーディオのサンプルを詳しく解説

サウンドは HTML でさまざまな方法で再生できます

問題と解決策

HTML で オーディオを再生するのは簡単ではありません。

オーディオ ファイルをすべてのブラウザ (Internet Explorer、Chrome、Firefox、Safari、Opera) およびすべてのハードウェア (PC、Mac、iPad、iPhone) で確実に再生するには、多くのコツを知る必要があります。

この章では、W3CSchool が問題と解決策をまとめています。

プラグインの使用

ブラウザ プラグインは、ブラウザの標準機能を拡張する小さなコンピュータ プログラムです。

プラグインは、922c72e1afaae8549a35684b67043089 タグまたは d8e2720730be5ddc9c2a3782839e8eb6 タグを使用してページに追加できます。

これらのタグは、タイプに応じて、リソース (通常は HTML 以外のリソース) のコンテナを定義します。ブラウザでも表示されます。外部プラグインでも表示されます。

d8e2720730be5ddc9c2a3782839e8eb6 要素

d8e2720730be5ddc9c2a3782839e8eb6 タグを使用して、外部 (非 HTML) コンテンツのコンテナーを定義します。 (これは HTML5 タグであり、HTML4 では違法ですが、すべてのブラウザーで機能します)。

次のコード スニペットは、Web ページに埋め込まれた MP3 ファイルを表示します。

例

<embed height="50" width="100" src="horse.mp3">

問題:

d8e2720730be5ddc9c2a3782839e8eb6 タグは HTML 4 では無効です。ページは HTML 4 検証に失敗します。

ブラウザーが異なれば、オーディオ形式のサポートも異なります。

ブラウザがそのファイル形式をサポートしていない場合、プラグインなしでは音声を再生できません。

ユーザーのコンピュータにプラグインがインストールされていない場合、オーディオを再生できません。

ファイルを他の形式に変換した場合でも、すべてのブラウザで再生できるわけではありません。

273238ce9338fbb04bee6997e5552b95 要素

bfcf4088aefe6ea3d3ddf666e5427000 を使用すると、外部 (非 HTML) コンテンツのコンテナを定義することもできます。

次のコード スニペットは、Web ページに埋め込まれた MP3 ファイルを表示できます:

例

<object height="50" width="100" data="horse.mp3"></object>

問題:

ブラウザーごとにサポートされるオーディオ形式が異なります。

ブラウザがそのファイル形式をサポートしていない場合、プラグインなしでは音声を再生できません。

ユーザーのコンピュータにプラグインがインストールされていない場合、オーディオを再生できません。

ファイルを他の形式に変換した場合でも、すべてのブラウザで再生できるわけではありません。

HTML5 b97864c2e0ef2353a16c4d64c7734e92 要素の使用

HTML5 b97864c2e0ef2353a16c4d64c7734e92 要素は HTML 4 では無効ですが、すべてのブラウザーで機能します。

b97864c2e0ef2353a16c4d64c7734e92 要素は最新のすべてのブラウザで動作します。

以下では、b97864c2e0ef2353a16c4d64c7734e92 タグを使用して MP3 ファイルを記述し (Internet Explorer、Chrome、Safari で有効)、OGG タイプのファイルも追加します。 (Firefox および Opera ブラウザーで有効) 失敗すると、次のエラー テキスト メッセージが表示されます。ページは HTML 4 検証に失敗します。

オーディオファイルを別の形式に変換する必要があります。

b97864c2e0ef2353a16c4d64c7734e92 要素は古いブラウザでは機能しません。

最好的 HTML 解决方法

下面的例子使用了两个不同的音频格式。HTML5 b97864c2e0ef2353a16c4d64c7734e92 元素会尝试以 mp3 或 ogg 来播放音频。如果失败，代码将回退尝试 d8e2720730be5ddc9c2a3782839e8eb6 元素。

实例

问题:

您必须把音频转换为不同的格式。

d8e2720730be5ddc9c2a3782839e8eb6 元素无法回退来显示错误消息。

雅虎媒体播放器 - 一个简单的添加音频到你网站上的方式

使用雅虎播放器是免费的。如需使用它，您需要把这段 JavaScript 插入网页底部：

雅虎播放器可以播放MP3以及其他各种格式。你只需添加一行代码到你的页面或 博客中就可以轻松地将您的HTML页面制作成 专业的播放列表：

实例

<a href="horse.mp3">Play Sound</a>
<script src="www.php.cn/latest"></script>

如果你要使用它，您需要把这段 JavaScript 插入网页底部：

<script src="www.php.cn/latest"></script>

【相关推荐】

1. 特别推荐：“php程序员工具箱”V0.1版本下载

2. 免费html在线视频教程

3. php.cn原创html5视频教程

以上がHTMLオーディオのサンプルを詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。