[Bootstrap4] 画像・サイジング

画像

class: "image-fluid"
親要素に合わせてレスポンシブ対応

class: "img-thumbnail"
1pxのボーダーが付く

class: "rounded"
角が少し丸くなる

class: "rounded-circle"
画像全体が丸くなる

class: "rounded-lg"
ほんの少しだけ半径の大きい丸になる

class: "rounded-pill"
カプセル型の丸になる

サイジング

class: "w-25"　　　　　　　　　　wは横幅、hにすると高さのサイズが変わる

class: "w-50"

class: "w-75"　　　　　　　　　　数字は%換算

class: "w-100"

class: "w-auto"　　　　　　　　　autoは自動算出した幅

image
class: "mw-100"　　　　　　　　画像の横幅が画面幅に追従（いつでも横幅ぴったし）

div class="container-fluid" style="height: 300px;"
　class: "mh-100"
/div　　　　　　　　　　　　　　　高さが親要素に追従