web-dev-qa-db-ja.com

html 5オーディオタグの幅

オーディオタグの幅を設定できるかどうか疑問に思っていました。デフォルトではサポートされている機能ではないため、「ハッキング」は喜んで受け入れられます。
すでに小さなdivとテーブルに入れてみましたが、それはあまり滑らかに見えません...私が見る限り、それについて悩んでいるのは私だけです。

クロスプラットフォーム/ブラウザのサポートは必要ありません。 FireFox(3.6 ++)がサポートしている限り、私は満足しています。

私が使用するものに関する簡単な例:

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

CSSを使用して、他のHTML要素の幅を設定するのと同じ方法で設定します。

audio { width: 200px; }

Firefoxではaudioはデフォルトでインライン要素であるため、display: blockに設定することもできます。 ここに例があります

47
robertc

インラインの例を探している人のために、ここに一つあります:

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

少なくとも驚くほどではなく、「高さ」設定を尊重していないようです。しかし、コントロールをいつでも「カスタマイズ」できますが、(組み込みのものを使用する代わりに)独自のコントロールを作成するか、同様に独自のコントロールを作成する誰かのウィジェットを使用します:)

11
rogerdpack

JavaScriptを使用してオーディオタグの幅を設定することもできます。

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

Htmlを使用して、単純なことで上司になることができます。

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

0
XMMR12