Create Round Circle shape images in HTML,PHP using Bootstrap classes

How to show images in complete circle shape inside web page using .img-circle bootstrap class.

In this tutorial we are using bootstrap’s .img-circle class which will automatically converts any image into circle shape. With this class use web developer doesn’t need to crop all the images by itself and this will save lot’s of time of website admin. So here is the complete step by step tutorial for Create Round Circle shape images in HTML,PHP using Bootstrap classes.

How to Create Round Circle shape images in HTML,PHP using Bootstrap classes.

https://www.android-examples.com/demo/heading-tag.html
Code for round-shape-images.html file.

 <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Round shape image</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

</head>

<body>

<div class="container">

<h1>Round shape image</h1>

<img src="https://www.android-examples.com/wp-content/uploads/2016/01/sample_round-image.png" class="img-circle" alt="Round shape image" width="300" height="300">
 
</div>

</body>
</html>

Screenshot:

Create Round Circle shape images in HTML,PHP using Bootstrap classes