该楼层疑似违规已被系统折叠 隐藏此楼查看此楼
Document.mat{
margin-left: 200px;
margin-top: 100px;
animation: myfirst 5s linear infinite alternate ;
position: relative;
animation-iteration-count:
}
@keyframes myfirst{
0% {left:0px; top:0px;}
/*25% {left:200px; top:0px;}
50% {left:200px; top:200px;}
75% {left:0px; top:200px;}
100% {left:0px; top:0px;}*/
100%{left: 1000px;top: 0px;}
}
.head{
width: 200px;
height: 200px;
background: rgb(50,174,230);
border-radius: 92px /100px;
z-index: 1;
border:1px solid black;
}
.eye{
position: relative;
left:53px;
top: 25px;
z-index: 2;
}
.left,.right{
width: 45px;
height: 55px;
background: white;
border: 1px solid black;
border-radius: 20px;
/*display: inline-block;
position: relative;*/
float: left;
}
.left div,.right div{
width: 10px;
height: 10px;
background: black;
border-radius: 5px;
}
.left div{
position: relative;
left:30px;
top:30px;
}
.right div{
position: relative;
left:5px;
top: 30px;
}
.face{
width: 165px;
height: 130px;
background: white;
position: relative;
top: 50px;
left:18px;
border-radius: 80px/60px;
z-index: 1;
}
.nose{
width: 20px;
height: 20px;
background: red;
border:1px solid black;
border-radius: 10px;
position: relative;
top:24px;
left:71px;
/*transition: width 2s,height 2s;*/
}
/*.nose:hover{
width: 50px;
height: 50px;
}*/
.shu{
height: 60px;
width: 0;
border:1px solid black;
position: relative;
top:22px;
left: 81px;
z-index: 1;
}
.goatee1 p,.goatee2 p{
width: 40px;
border-top: 1px solid black;
line-height: 10px;
margin-top: -8px;
}
.goatee1 p{
position: relative;
top: -35px;
left:15px;
}
.goatee2 p{
position: relative;
top:-62px;
left:110px;
}
.div1{
width: 100px;
height: 50px;
background: black;
border-radius: 50px/25px;
margin-left: 5px
}
.div2{
width: 110px;
height: 50px;
border-radius: 55px/25px;
background: white;
margin-top: -53px;
}
.mouth{
position: relative;
top:-78px;
left:28px;
/*z-index: -1;*/
}
.necklace{
width: 160px;
height: 16px;
background: rgb(144,20,4);
border:1px solid black;
border-radius: 8px;
position: relative;
top: -30px;
left: 20px;
z-index: 1;
}
.bell{
width: 24px;
height: 24px;
background: yellow;
border:1px solid black;
border-radius: 12px;
position: relative;
top:8px;
left:66px;
z-index: 1;
}
.div3,.div4{
width: 100%;
height: 0;
border-top: 1px solid black;
/*margin-top:10px; */
}
.div3{
margin-top: 5px;
margin-bottom: 2px;
}
.cirle{
width: 6px;
height: 6px;
background: black;
border-radius: 3px;
position: relative;
top:3px;
left:9px;
}
.div5{
width: 0;
height: 4px;
border:1px solid ;
position: relative;
top:3px;
left:11px;
}
.body{
width: 160px;
height: 115px;
background:rgb(50,174,230) ;
position: relative;
top: -38px;
left: 20px;
border:1px solid black;
}
.pocket{
width: 110px;
height: 110px;
background: white;
border:1px solid black;
border-radius: 55px;
position: relative;
top:-15px;
left:25px;
}
.pocket div{
width: 90px;
height: 45px;
background: white;
border:1px solid black;
border-radius: 0 0 90px 90px/
90px 90px 90px 90px;
position: relative;
top:55px;
left:10px;
}
.arm1,.arm2{
width: 40px;
height: 30px;
background: rgb(50,174,230);
border-top: 1px solid black;
border-bottom:1px solid black
}
.arm1{
position: relative;
top:-112px;
left:-40px;
}
.arm2{
position: relative;
top:-145px;
left:160px;
}
.hand1,.hand2{
width: 30px;
height: 30px;
background: white;
border:1px solid black;
border-radius: 15px;
position: relative;
}
.hand1{
top:-176px;
left:-55px;
}
.hand2{
top:-209px;
left:185px;
}
.div6{
width: 16px;
height: 8px;
background: white;
border-top:1px solid black;
border-right: 1px solid black;
border-left: 1px solid black;
border-radius: 16px 16px 0 0/16px;
position: relative;
top:-133px;
left:72px;
}
.foot1,.foot2{
width: 85px;
height: 20px;
background: white;
border:1px solid black;
border-radius: 10px;
position: relative;
}
.foot1{
top:-134px;
left:-8px;
}
.foot2{
top:-156px;
left:82px;
}
.p1,.p6{
transform: rotate(15deg);
}
.p3,.p4{
transform: rotate(-15deg);
}