elibraryportal Logo

Bootstrap Images

1) Rounded Corners Image in Bootstrap

Use the .rounded class adds rounded corners to an image.

Syntax:-

Test it Now

2) Circle Image in Bootstrap

Use the .rounded-circle class adds shapes in an image.

Syntax:-

Test it Now

3) Thumbnail Image in Bootstrap

Use the .img-thumbnail class shapes the image to a thumbnail (bordered).

Syntax:-

Test it Now

4) Align Images in Bootstrap

If you want to use left or right images the use the .float-right class and .float-left class.

Syntax:-

Test it Now

5) Centered Image in Bootstrap

For center use of images .mx-auto (margin:auto) & .d-block

Syntax:-

Test it Now

6) Responsive Images in Bootstrap

Create responsive images use of .img-fluid

Syntax:-

Test it Now