ブートストラップでhtml5オーディオを反応させる方法はありますか？

Question

シンプルなHTML5オーディオプレーヤーがあり、ブートストラップで反応させたいと思っています。

<div class="col-sm-4 col-sm-offset-4"> 
     <audio controls style="width: 600px;"> 
     <source src="sample.mp3"> 
     </audio> 
    </div> 

どんなコンテンツそれであるか、少なくともクラスか何かがオーディオプレーヤーが応答するために応答このオーディオプレーヤーを含むDIVをしない方法はありますか？可能であれば、外部ライブラリを使用する必要はありません。

ありがとうございます！

Answer 1

は、私がwidth:100%とmax-width:600pxを使用することをお勧めします。 デスクトップのブラウザでウィンドウを小さくすると、実際のモバイルデバイスと同じように表示されませんが、モバイルデバイス（iOS、Androidなど）のオーディオ要素は確実に小さくなります。その外観に多くの影響を与えます。これらの設定とともに、あらゆる状況に適切に適応する必要があります。

（あなただけのogg形式でオーディオと二sourceのタグを追加してもhttps://www.w3schools.com/tags/tag_audio.aspを参照して、ソースタグ/ sのファイル形式を追加したい場合があります）どのような方法で応答

Answer 2

試してみてください。

<div class="col-sm-4 col-sm-offset-4 embed-responsive embed-responsive-4by3"> 
    <audio controls class="embed-responsive-item"> 
     <source src="sample.mp3"> 
    </audio> 
</div> 

参考：http://getbootstrap.com/components/#responsive-embed