如何将声音添加到HTML5网页

HTML5可以轻松地使用元素为您的网页添加声音和音乐。事实上，最难的事情是创建所需的多个源，以确保您的声音文件在最广泛的浏览器上播放。

使用HTML5的好处是只需使用几个标签即可嵌入声音。然后，浏览器播放声音就像使用时显示图像一样

IMG 元件。

如何将声音添加到HTML5网页

您需要一个HTML编辑器，一个声音文件（最好是MP3格式）和一个声音文件转换器。

1. 首先，您需要一个声音文件。最好将文件记录为MP3（

   .MP3）因为它具有很高的音质，并且得到大多数浏览器的支持（Android 2.3 +，Chrome 6 +，IE 9 +，iOS 3+和Safari 5+）。

2. 将您的文件转换为Vorbis格式（

   .OGG）添加Firefox 3.6+和Opera 10.5+支持。您可以使用Vorbis.com上的转换器。您还可以将MP3转换为WAV文件格式（

   .WAV）获得Firefox和Opera支持。我建议在所有三种类型中发布您的文件，仅为了安全起见，但您最需要的是MP3和另一种类型。

3. 将所有音频文件上传到您的Web服务器并记下您存储它们的目录。最好将它们放在子目录中，仅用于音频文件，就像大多数设计师将图像保存在

   图片 目录。

4. 添加

   AUDIO 您要在其中显示声音文件控件的HTML文件的元素。

5. 地点

   资源 你在里面上传的每个音频文件的元素

   AUDIO 元件：

6. 1. 里面的任何HTML

      AUDIO element将用作不支持的浏览器的后备

      AUDIO 元件。所以添加一些HTML。最简单的方法是添加HTML以允许他们下载文件，但您也可以使用HTML 4.01嵌入方法来播放声音。这是一个简单的后备：

      您的浏览器不支持音频播放，请下载文件：MP3，

   2. Vorbis格式，WAV

7. 您需要做的最后一件事是关闭您的AUDIO元素：

   1. 完成后，您的HTML应如下所示：

   4. 您的浏览器不支持音频播放，请下载文件：

   5. MP3，

   6. Vorbis格式，

   7. WAV

其他提示

• 请务必使用HTML5 doctype（），以便HTML验证
• 查看元素的可用属性，以查看可以向元素添加的其他选项。
• 请注意，我们默认设置HTML以包含控件，并关闭自动播放功能。当然，你可以改变这一点，但要记住，许多人发现自动启动的声音/他们无法控制的声音充其量是烦人的，并且通常会在发生这种情况时离开页面。