2011-04-12 261 views
19

我想知道是否可以設置音頻標籤的寬度。默認情況下,它不是受支持的功能,所以「黑客」將會被高興地接受。
我已經試過把它們放在小格子和桌子上,但看起來不太平滑......據我所知,我是唯一一個困擾它的人,但我真的很感謝一些幫助html 5音頻標籤寬度

不需要跨平臺/瀏覽器支持;只要FireFox(3.6 ++)支持,我很高興。

簡單的例子,什麼我將使用:

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

回答

36

設置它,你會設置其他任何HTML元素的寬度相同的方式,用CSS:

audio { width: 200px; } 

audio是Firefox中默認的內聯元素,因此您可能還想將其設置爲display: blockHere's an example

+3

恥辱鉻玩家只擴展到的800像素的寬度中心本身之前。 – Harvey 2015-09-02 22:39:01

7

對於那些尋找一個內嵌例子,這裏是一個:

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

它似乎並不尊重「高度」設置,至少不會赫然。但你可以隨時「定製」控件,但創建自己的控件(而不是使用內置的控件)或使用某人的小部件,類似地創建它自己的:)

1

您還可以設置音頻標籤的寬度JavaScript的:

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

您可以使用HTML,是一個老闆簡單的事情:

<embed src="music.mp3" width="3000" height="200" controls>