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.
![](static/picture/11.jpg)
Image thumbnails
You can use .img-thumbnail
to give an image a rounded.
![](static/picture/user-4.jpg)
Kathryn Money
UI & UX Designer, Japan
Image rounded
You can use .rounded
to give an image a rounded.
![](static/picture/user-5.jpg)
Anthony Stover
UI & UX Designer, USA
Image circle
You can use .rounded-circle
to give an image a circle.
![](static/picture/user-6.jpg)
Catherine Orman
UI & UX Designer, India
Aligning images
You can use .float-end
and .float-start
to give an image position.
![](static/picture/user-4.jpg)
![](static/picture/user-10.jpg)
Aligning images
You can use .d-block .mx-auto
image center.
![](static/picture/user-7.jpg)