.dw{ width: 100%; height: auto; display: flex; justify-content: center; align-items: center; margin: 0; padding: 0; overflow: auto; } .fei { display: flex; /*position: relative;*/ position: absolute; border-radius: 50% / 50%; height: 100px;width: 100px; background: white; box-shadow: white -30px -5px 5px 5px, white 30px -5px 5px 5px, white 0px 5px 5px 0px, pink 30px -5px 1px 30px, pink -30px -5px 1px 30px, pink -15px -10px 1px 40px, pink 15px -10px 1px 40px, pink 0px 0px 0 28px; } .daimao { border-radius: 100% 0%; position: absolute; top: -90px; right: 2px; transform: rotate(-40deg); width: 60px;height: 30px; background-color: rgb(255, 164, 180); } .chi::after, .chi::before { position: absolute; display: block; content:''; background-color: pink; width: 45px; height: 52px; } .chi::after{ transform: rotate(98deg); border-radius: 10% 20% 80% 20%; top: -5px; right: 155px; box-shadow: pink 12px 2px 0 5px, pink 25px -15px 0 3px; } .chi::before{ transform: rotate(-100deg); border-radius: 10% 20% 20% 90%; top: -8px; right: -95px; box-shadow: pink -10px 2px 0 5.5px, pink -25px -10px 0 3px; } .zui::after, .zui::before{ position:absolute; content:''; display:block; top:70px; left:42px; width:25px; height:2.5px; border-radius: 40%; background-color:black; } .zui::after{ transform: rotate(28deg); } .zui::before{ transform: rotate(-28deg); } .yan::after, .yan::before { content:''; display:block; background-color: black; border-radius: 40%; position:absolute; width: 7px; height: 35px; } .yan::after { top: 20px; right: 5px; transform: rotate(-10deg); } .yan::before { top: 20px; right: 80px; transform: rotate(5deg); }