console
<div class="bg"></div>
<div class="dot"></div>
<div class="line-h"></div><div class="line-v"></div>
body {
margin: 0;
padding: 0
}
.line-h{
width:1px;
height:240px;
position:absolute;
left:115px;
background:#000;
}
.line-v{
height:1px;
width:240px;
position:absolute;
top:115px;
background:#000;
}
.bg {
position: absolute;
left: 5px;
top: 5px;
width: 220px;
height: 220px;
border: 1px solid green;
border-radius: 50%;
}
.dot {
width: 10px;
height: 10px;
background: red;
border-radius: 50%;
position: absolute;
left: 32px;
top: 32px;
animation: round 5s linear infinite;
transform-origin: 83px 83px;
}
@keyframes round {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}