In this blog, I'll tell you how to style images whether its image with rounded corners, image with circular shape, image with thumbnail shape. 
Rounded Corners :- 
The  class .img-rounded is used to add rounded corners to an image.
<div class="container">
  <h2>Image with Rounded Corners</h2>
          
  <img src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcRyycuqa9htsDRKTkIfr_L_JzJjsEjXVsa_A6-GNW-CvSpxTiraZ172KHs" class="img-rounded" alt="Cinque Terre" width="304" height="236"> 
</div>
https://jsfiddle.net/fok4a0bb/3/
Circle Images :- 
The class .img-circle is used to add the circle image.
<div class="container">
  <h2>Circle Image</h2>            
  <img src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcRyycuqa9htsDRKTkIfr_L_JzJjsEjXVsa_A6-GNW-CvSpxTiraZ172KHs" class="img-circle" alt="Cinque Terre" width="190px" height="190px"> 
</div>
https://jsfiddle.net/9kjqc5qs/2/
Thumbnail Images :- 
The class .img-thumbnail is used to shape the image to a thumbnail.
<div class="container">
  <h2>Thumbnail Image</h2>           
  <img src="cinqueterre.jpg" class="img-thumbnail" alt="Cinque Terre" width="304" height="236"> 
</div>
https://jsfiddle.net/f3b4sc4b/2/
 
                       
                    
0 Comment(s)