Bootstrap 5 Images



Rounded Corners
The .rounded
class adds rounded corners to an image:
Example
<img src="cinqueterre.jpg" class="rounded" alt="Cinque Terre">
Circle
The .rounded-circle
class shapes the image to a circle:
Example
<img src="cinqueterre.jpg" class="rounded-circle" alt="Cinque Terre">
Thumbnail
The .img-thumbnail
class shapes the image to a thumbnail (bordered)::
Example
<img src="cinqueterre.jpg" class="img-thumbnail" alt="Cinque Terre">
Aligning Images
Float an image to the left with the .float-start
class or to the right with .float-end
: