.box1{
width: 200px;
height: 200px;
background: skyblue;
border-radius: 100px;
position: relative;
margin: 0 auto;
border: 3px solid black;
box-shadow: 7px 5px 6px white inset ;
}
.box2{
width: 150px;
height: 135px;
background: #fff;
border-radius: 50% / 50%;
position: absolute;
left: 25px;
bottom: 10px;
border: 3px solid black;
}
.yanjing1{
height: 40px;
width: 30px;
border-radius: 30px;
border: 3px solid black;
position: absolute;
left: 65px;
top: 15px;
z-index: 5;
background: white;
}
.yanjing2{
height: 40px;
width: 30px;
border-radius: 30px;
border: 3px solid black;
position: absolute;
right: 63px;
top: 15px;
z-index: 5;
background: white;
}
.yanzhu1{
width: 10px;
height: 10px;
background: black;
border-radius: 30px;
position: absolute;
bottom: 10px;
right: 5px;
}
.yanzhu2{
width: 10px;
height: 10px;
background: black;
border-radius: 30px;
position: absolute;
bottom: 10px;
left: 5px;
}
span{
display: block;
width: 80px;
height: 100px;
border-bottom: 1px solid #000;
border-radius: 0px 0px 50px 50px;
position: absolute;
left: 33px;
bottom: 20px;
}
.bizi{
height: 30px;
width: 30px;
position: absolute;
background: red;
border-radius: 50%;
left: 56px;
top: 25px;
border: 3px solid black;
box-shadow: 6px 2px 13px white inset ;
}
.biliang{
height: 57px;
width: 3px;
background: black;
position: absolute;
left: 72px;
top: 58px;
}
.huxu1{
width: 35px;
height: 3px;
background: black;
position: absolute;
left: 20px;
top: 70px;
}
.huxu2{
width: 35px;
height: 3px;
background: black;
position: absolute;
left: 20px;
top: 60px;
transform: rotate(190deg) ;
}
.huxu3{
width: 35px;
height: 3px;
background: black;
position: absolute;
left: 20px;
top: 80px;
transform: rotate(170deg) ;
}
.huxu4{
width: 35px;
height: 3px;
background: black;
position: absolute;
right: 20px;
top: 70px;
}
.huxu5{
width: 35px;
height: 3px;
background: black;
position: absolute;
right: 20px;
top: 60px;
transform: rotate(-10deg) ;
}
.huxu6{
width: 35px;
height: 3px;
background: black;
position: absolute;
right: 20px;
top: 80px;
transform: rotate(10deg) ;
}
p{
width: 150px;
height: 15px;
background: #DF5000;
position: absolute;
margin-left: -78px;
left: 50%;
margin-top: -25px;
border-radius: 10px;
border: 3px solid black;
z-index: 10;
}
.shenti{
height: 100px;
width: 140px;
background: skyblue;
position: relative;
left: 50%;
margin-left: -73px;
margin-top: -5px;
border: 3px solid black;
border-top: none;
box-shadow: 2px -1px 27px black inset ;
}
.pifu{
height: 100px;
width: 100px;
border-radius: 50%;
background: white;
position: absolute;
left: 50%;
margin-left: -52px;
top: -20px;
border: 3px solid #000000;
}
.lingdang{
height: 30px;
width: 30px;
background: yellow;
border-radius: 50%;
position: relative;
left: 50%;
margin-left: -17px;
top: 9px;
overflow: hidden;
border: 3px solid black;
z-index: 30;
box-shadow: 7px 5px 6px white inset ;
}
.xian1{
height: 2px;
width: 30px;
background: black;
top: 10px;
position: absolute;
}
.xian2{
height: 2px;
width: 30px;
background: black;
top: 6px;
position: absolute;
}
.tuoyuan{
height: 10px;
width: 10px;
border-radius: 50%;
background: black;
position: absolute;
bottom: 6px;
left: 10px;
}
.shuxian{
position: absolute;
width: 2px;
height: 5px;
bottom: 1px;
left: 14px;
background: black;
}
.koudai{
position: absolute;
width: 70px;
height: 35px;
border:3px solid black;
background-color:white;
border-radius: 0px 0px 100px 100px;
left: 13px;
top: 53px;
}
.zuo{
height: 40px;
width: 40px;
border: 3px solid black;
border-radius: 50%;
position: absolute;
left: 630px;
top: 220px;
}
.you{
height: 40px;
width: 40px;
border: 3px solid black;
border-radius: 50%;
position: absolute;
left: 860px;
top: 220px;
}
.zuojiao{
position: absolute;
height: 20px;
width: 90px;
border: 3px solid black;
left: 50%;
margin-left: -100px;
top: 309px;
border-radius: 100px 90px 90px 50px;
}
.youjiao{
position:absolute;
height: 20px;
width: 90px;
border: 3px solid black;
left: 50%;
margin-left: 5px;
top: 309px;
border-radius: 90px 100px 50px 90px;
}
.zuogebo{
width: 35px;
height: 3px;
position: absolute;
left: 50%;
margin-left:-105px;
background: black;
top: 217px;
transform: rotate(155deg);
}
.yougebo{
width: 35px;
height: 3px;
position: absolute;
left: 50%;
margin-left:70px;
background: black;
top: 217px;
transform: rotate(24deg);
}
</style>
</head>
<body>
<div class="box1">
<h1 class="yanjing1">
<div class="yanzhu1"></div>
</h1>
<h1 class="yanjing2">
<div class="yanzhu2"></div>
</h1>
<div class="box2">
<span></span>
<div class="bizi"></div>
<div class="biliang"></div>
<div class="huxu1"></div>
<div class="huxu2"></div>
<div class="huxu3"></div>
<div class="huxu4"></div>
<div class="huxu5"></div>
<div class="huxu6"></div>
</div>
</div>
<p></p>
<div class="shenti">
<div class="pifu">
<div class="lingdang">
<div class="xian1"></div>
<div class="xian2"></div>
<div class="tuoyuan"></div>
<div class="shuxian"></div>
</div>
<div class="koudai"></div>
</div>
</div>
<div class="zuojiao"></div>
<div class="youjiao"></div>
<div class="zuo"></div>
<div class="you"></div>
<div class="zuogebo"></div>
<div class="yougebo"></div>
</body>