Images
Responsive images
Images in Bootstrap are made responsive with
.img-fluid
. max-width: 100%;
and
height: auto;
are applied to the image so that it scales with the parent element.

Image thumbnails
You can use .img-thumbnail
to give an image a rounded.

Kathryn Money
UI & UX Designer, Japan
Image rounded
You can use .rounded
to give an image a rounded.

Anthony Stover
UI & UX Designer, USA
Image circle
You can use .rounded-circle
to give an image a circle.

Catherine Orman
UI & UX Designer, India
Aligning images
You can use .float-right
and .float-left
to give an image position.


Aligning images
You can use .d-block .mx-auto
image center.
