画像 Images
img要素に使う画像用のクラス。
レスポンシブ画像
img要素のclass属性にimg-responsiveを指定することで、画像サイズをレスポンシブに変化させることができる。
サンプル
ソースコード
<img src="../img/sample-1140x641.png" class="img-responsive" alt="サンプル画像">
画像の形
画像の形に関するスタイルが３つ用意されている。
ただし、Internet Explorer 8 以下には対応していない。
サンプル
ソースコード
<img src="../img/sample-256x256.png" class="img-rounded" alt="サンプル画像"> <img src="../img/sample-256x256.png" class="img-circle" alt="サンプル画像"> <img src="../img/sample-256x256.png" class="img-thumbnail" alt="サンプル画像">
形を指定したレスポンシブ画像
サンプル
ソースコード
<p> <img src="../img/sample-1140x641.png" class="img-responsive img-rounded" alt="サンプル画像"> </p> <p> <img src="../img/sample-1140x641.png" class="img-responsive img-circle" alt="サンプル画像"> </p> <p> <img src="../img/sample-1140x641.png" class="img-responsive img-thumbnail" alt="サンプル画像"> </p>