html - HTML5 MP3 播放器

Question

我正在尝试制作一个简单的 HTML5 播放器，它有一个用于播放和暂停的按钮，来自 2 个图像，就是这样。而不是拥有标准的“控制”。

<audio controls="controls">
<source src=".ogg" />
<source src=".mp3" />
</audio>

我怎样才能做到这一点？

Answer 1

只需添加 CSS 样式设置widthas 45px。

CSS：

audio { width: 45px; }

HTML：

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

这就是它在 Google Chrome 中的外观。

这就是它在 IE 9 中的样子。