如何在 HTML 中嵌入音频

在 HTML 中嵌入音频可以为页面增添声音效果，以及为访问者带来更好的用户体验。本文将介绍在 HTML 中嵌入音频的方法。

使用

在 HTML5 中，可以使用

<audio controls>
  <source src="sound.mp3" type="audio/mpeg">
  <source src="sound.ogg" type="audio/ogg">
  Your browser does not support the audio element.
</audio>

在上面的代码中，我们在

<audio> 标签需要使用控件属性 (controls) 来提供播放、暂停和音量控件。

播放自动启动

要在播放页面时自动启动音频，设置 autoplay 属性：

<audio controls autoplay>
  <source src="sound.mp3" type="audio/mpeg">
  <source src="sound.ogg" type="audio/ogg">
  Your browser does not support the audio element.
</audio>

循环播放

要循环播放音频，设置 loop 属性：

<audio controls loop>
  <source src="sound.mp3" type="audio/mpeg">
  <source src="sound.ogg" type="audio/ogg">
  Your browser does not support the audio element.
</audio>

设置播放器外观

可以使用 CSS 样式表来美化

audio {
  display: block;
  margin: 0 auto;
  width: 50%;
}

在上面的 CSS 中，我们将

结论

在 HTML 中嵌入音频很容易，只需使用