纯css实现猫乘坐螺旋桨飞机动画效果

代码语言:html

所属分类:布局界面

代码描述:纯css实现猫乘坐螺旋桨飞机动画效果

代码标签: 乘坐 螺旋桨 飞机 动画 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<style>
body{
	margin:0;
	color:#444;
	background:#58d0fe;
	font:300 18px/18px Roboto, sans-serif;
}
*,:after,:before{box-sizing:border-box}
.pull-left{float:left}
.pull-right{float:right}
.clearfix:after,.clearfix:before{content:'';display:table}
.clearfix:after{clear:both;display:block}

.plane .fan,
.plane .wheel .left,
.plane .wheel .right,
.plane .wings:before,
.plane .wings:after,
.plane .wheel .left:before,
.plane .wheel .right:after{
	background:#000;
}
.cloud .line-b:before,
.cloud .line-b:after,
.cloud .line-d:before,
.cloud .line-d:after,
.plane .wings:before,
.plane .wings:after,
.plane .cat .legs:before,
.plane .cat .legs:after,
.plane .wheel .left:before,
.plane .wheel .right:after,
.plane .fan .fan-wings .fan-a:before,
.plane .fan .fan-wings .fan-b:before,
.plane .fan .fan-wings .fan-c:before,
.plane .fan .fan-wings .fan-d:before{
	content:'';
	position:absolute;
}

.cloud{
	width:120px;
	height:50px;
	overflow:hidden;
	position:fixed;
}
.cloud-a{
	top:1.........完整代码请登录后点击上方下载按钮下载查看

网友评论0