Images

You can use normal images or responsive images.

Responsive images

Images are made responsive with .img-fluid (max-width: 100%) and height: auto. With this setup the image scales with the parent element.

Responsive image
<img src="..." class="img-fluid" alt="Responsive image">

Image thumbnails

You can use .img-thumbnail to give an image a rounded 1px border appearance.

Thumbnail
<img src="..." class="img-thumbnail" alt="Thumbnail">

You can use Bootstrap utilities to make an image or thumbnail rounded:

Thumbnail
<img src="..." class="img-thumbnail rounded-circle" alt="Thumbnail">

View the other possibilities of use for images in the official documentation.

Loading...