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

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

問題と解決策

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

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

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

プラグインの使用

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

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

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

要素

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

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

例

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

問題:

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

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

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

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

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

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

例

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

問題:

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

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

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

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

HTML5

HTML5

以下では、

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

最好的 HTML 解决方法

下面的例子使用了两个不同的音频格式。HTML5

实例

问题:

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

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

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

使用雅虎播放器是免费的。如需使用它，您需要把这段 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 サイトの他の関連記事を参照してください。