Source Code Here -
<!DOCTYPE html>
<html>
<head>
<title>Ashok Chakra Source Code Free Download</title>
<style >
*{
margin: 0;
padding: 0;
}
.outer{
width:100%;
height:100vh;
align-items: center;
justify-content: center;
display:flex;
}
.chakra{
width: 96px;
height: 96px;
border:2px solid blue;
border-radius: 50%;
margin: auto;
}
.chakra li{
list-style: none;
width: 94px;
border: 1px solid blue;
position: relative;
}
li:nth-child(1){
top: 47px;
}
li:nth-child(2){
top: 45px;
transform: rotate(90deg);
}
li:nth-child(3){
top: 43px;
transform: rotate(15deg);
}
li:nth-child(4){
top: 41px;
transform: rotate(30deg);
}
li:nth-child(5){
top: 39px;
transform: rotate(45deg);
}
li:nth-child(6){
top: 37px;
transform: rotate(60deg);
}
li:nth-child(7){
top: 35px;
transform: rotate(75deg);
}
li:nth-child(8){
top: 33px;
transform: rotate(105deg);
}
li:nth-child(9){
top: 31px;
transform: rotate(120deg);
}
li:nth-child(10){
top: 29px;
transform: rotate(135deg);
}
li:nth-child(11){
top: 27px;
transform: rotate(150deg);
}
li:nth-child(12){
top: 25px;
transform: rotate(165deg);
}
</style>
</head>
<body>
<div class="outer">
<div>
<h2 style="text-align: center;"> <span style="color: orange">Ashoka</span> <span style="color: green">Chakra</span> </h2>
<div class="chakra">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</div>
</div>
</div>
</body>
</html>
Download Source Code Here -
0 Comments