div+css实现夜晚月亮下飞龙在天动画效果代码
代码语言:html
所属分类:动画
代码描述:div+css实现夜晚月亮下飞龙在天动画效果代码,一直黑色的飞龙在月色下展翅飞翔
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {
background:#038 linear-gradient(#014,transparent) no-repeat;
background-size:100% 75vh;
overflow:hidden
}
#moon {
background:white;
border-radius:50%;
margin:20px auto;
width:240px;
height:240px
}
.cloud {
background:rgba(0,0,0,0.3);
border-radius:50%;
position:absolute;
right:-200px
}
.cloud.one {
top:20%;
width:100px;
height:20px;
animation:cloudShift 10s linear infinite
}
.cloud.two {
top:50%;
width:200px;
height:40px;
animation:cloudShift 3s linear infinite
}
.cloud.three {
top:80%;
width:150px;
height:30px;
animation:cloudShift 6s linear infinite
}
#dragon {
top:33%;
left:0;
right:0;
position:absolute;
height:100px;
width:400px;
margin:auto;
animation:bounce 1s infinite
}
#front,#head,#eye,#neck,#body,#armL,#armR,.hand,#wingL,#wingR,#legL,#legR,.foot,#tail,#outer,#inner,#tip {
position:a.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0