Bootstrapイメージのシェイプ
角丸：
サークル：
サムネイル：
角丸
.img-roundedクラスは、（IE8は丸い角をサポートしていません）画像に丸めコーナーを追加します。
例
<img src="cinqueterre.jpg" class="img-rounded" alt="Cinque Terre"
width="304" height="236"> »それを自分で試してみてください サークル
.img-circleクラスは、円（IE8は丸い角をサポートしていません）に画像を整形します：
例
<img src="cinqueterre.jpg" class="img-circle" alt="Cinque Terre"
width="304" height="236"> »それを自分で試してみてください サムネイル
.img-thumbnailクラスは、サムネイルにイメージを形作ります：
例
<img src="cinqueterre.jpg" class="img-thumbnail" alt="Cinque Terre"
width="304" height="236"> »それを自分で試してみてください レスポンシブイメージ
画像は、すべてのサイズで提供されます。 だから、画面を行います。 応答画像が自動的に画面のサイズに合わせて調整します。
追加することにより、応答画像を作成します。 .img-responsiveにクラスを<img>タグ。 画像は、親要素にうまく調整されます。
.img-responsiveクラスが適用されdisplay: block; そして、 max-width: 100%; そしてheight: auto; 画像へ：
イメージギャラリー
また、使用することができますBootstrap'sと一緒にグリッドシステムを.thumbnail画像ギャラリーを作成するクラス：
例
<div class="row">
<div class="col-md-4">
<a href="pulpitrock.jpg" class="thumbnail">
<p>Pulpit Rock: A famous tourist attraction in Forsand, Ryfylke, Norway.</p>
<img src="pulpitrock.jpg" alt="Pulpit
Rock" style="width:150px;height:150px">
</a>
</div>
<div
class="col-md-4">
<a href="moustiers-sainte-marie.jpg"
class="thumbnail">
<p>Moustiers-Sainte-Marie:
Considered as one of the "most beautiful villages of France".</p>
<img src="moustiers-sainte-marie.jpg" alt="Moustiers Sainte Marie"
style="width:150px;height:150px">
</a>
</div>
<div class="col-md-4">
<a href="cinqueterre.jpg" class="thumbnail">
<p>The Cinque Terre: A rugged portion of coast in the Liguria region of
Italy.</p>
<img src="cinqueterre.jpg"
alt="Cinque Terre" style="width:150px;height:150px">
</a>
</div>
</div> »それを自分で試してみてください 応答埋め込みを
また、ビデオやスライドショーを任意のデバイス上で適切にスケーリングしましょう。
クラスはに直接適用することができる<iframe>, <embed>, <video> 、そして<object>要素。
次の例では、追加することにより、応答性のビデオを作成する.embed-responsive-itemにクラスを<iframe>タグ（動画は、親要素にうまく調整されます）。 含む<div>映像のアスペクト比を定義します。
例
<div class="embed-responsive embed-responsive-16by9">
<iframe
class="embed-responsive-item" src="..."></iframe>
</div> »それを自分で試してみてください アスペクト比とは何ですか？
画像のアスペクト比は、幅と高さとの間の比例関係を記述する。 2つの一般的なビデオのアスペクト比は4：3（20世紀のユニバーサルビデオフォーマット）、および16：（HDテレビと欧州のデジタルテレビ用ユニバーサル）9。
次の2つのアスペクト比クラスから選択することができます。
<!-- 16:9 aspect ratio -->
<div class="embed-responsive embed-responsive-16by9">
<iframe
class="embed-responsive-item" src="..."></iframe>
</div>
<!-- 4:3 aspect ratio -->
<div class="embed-responsive embed-responsive-4by3">
<iframe
class="embed-responsive-item" src="..."></iframe>
</div>練習で自分自身をテスト！
完全なBootstrapイメージリファレンス
すべての画像クラスの完全なリファレンスについては、当社の完全に行くBootstrapイメージ参照 。