HTML 5音频标签的宽度

Question

我想知道是否可以设置音频标签的宽度。默认情况下不支持此功能，因此“hack”将被欣然接受。
我已经尝试将它们放入小的div和表格中，但看起来并不流畅...据我所见，似乎只有我在意这个问题，但我真的很感激一些帮助。

无需跨平台/浏览器支持；只要FireFox（3.6 ++）支持即可。

以下是我将使用的快速示例：

<audio preload="auto" id="id12" controls="controls" onended="func12();" src="http://192.168.1.68/mymusic.wav"></audio>

- user704063

---

你也可以考虑使用 zoom: 70%;。 - Avatar

Answer 1

使用CSS设置它的宽度，就像设置其他HTML元素的宽度一样：

audio { width: 200px; }

注意，在Firefox中，audio默认是行内元素，所以您可能还希望将其设置为display:block。这里有一个示例。

- robertc

---

Chrome播放器只有在扩展到800像素宽度后才会居中，这真是令人遗憾。 - harvzor

Answer 2

如果您正在寻找内联示例，这里就有一个：

<audio controls style="width: 200px;">
   <source src="http://somewhere.mp3" type="audio/mpeg">
</audio>

它似乎不太尊重 "height" 设置，至少没有做得很好。但是，您可以始终通过创建自己的控件（而不是使用内置的控件）或使用某人类似地创建自己的控件的小部件来 "自定义" 控件 :)

- rogerdpack

Answer 3

你也可以通过JavaScript设置音频标签的宽度：

audio = document.getElementById('audio-id');
audio.style.width = '200px';

- Calvin

Answer 4

你可以使用HTML来轻松掌控一些简单的事情： <embed src="music.mp3" width="3000" height="200" controls>

- XMMR12