
Do you want to display circular images on your website? With CSS3, this can be done with in few seconds. You can use CSS border-radius property to make rounded images. Just add below CSS code into your style-sheet.
.img-rounded {
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
}
Note: If you are using Blogger, go to "Edit HTML" and add it just before ]]></b:skin> tag.
Now when you want to make an image circular, just add "img-rounded" CSS class into it. Look at the example below:
<img class="img-rounded" src="https://www.bloggertipandtrick.net/wp-content/uploads/2016/08/rounded-images-with-css.jpg" />
Result:
