Bootstrap Images
Bootstrap has some classes for <img> tag. The classes can be used for styling images. they are following:
- .img-rounded
- .img-circile
- .img-thumbnail
Bootstrap img-rounded Class
By using this class you can add a rounded corner in an image.
Example:
<img src="images/bootstrap.png" class="img-rounded"
alt="Img"
width="300px"
height="200px"
>
Run Example
Bootstrap img-circle Class
By using this class you can give an image a circle shape.
Example:
Bootstrap img-thumbnail Class
By using this class you can give an image a thumbnail shape.
Example:
Bootstrap Responsive Images
Responsive images can automatically fit themselves to any size of screen. By using .img-responsive class you can make an image responsive. Some properties such as display: block; max-width: 100%; and height: auto; can be applied in the .img-responsive class.
Example:
Bootstrap Responsive Embeds
You can also set responsive videos by using the .embed-responsive-item class. This class can be applied in the iframe, audio, video, and object tags.