div+css实现多彩纸风车气球转动动画效果代码

代码语言:html

所属分类:动画

代码描述:div+css实现多彩纸风车气球转动动画效果代码

代码标签: div css 多彩 纸风车 气球 转动 动画

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">






    <style>
        html {
        		    height: 100%;
        		}
        		body{
        			height: 100%;
        		    margin: 0;
        		    background-repeat: no-repeat;
        		    background-attachment: fixed;
        			overflow: hidden;
        			background-image: -moz-linear-gradient(top, rgba(102,182,252,0.5) 0%, rgba(255,255,255,1) 100%);
        			background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(102,182,252,0.5)), color-stop(100%,rgba(255,255,255,1)));
        			background-image: -webkit-linear-gradient(top, rgba(102,182,252,0.5) 0%,rgba(255,255,255,1) 100%);
        			background-image: -o-linear-gradient(top, rgba(102,182,252,0.5) 0%,rgba(255,255,255,1) 100%);
        			background-image: -ms-linear-gradient(top, rgba(102,182,252,0.5) 0%,rgba(255,255,255,1) 100%);
        			background-image: linear-gradient(to bottom, rgba(102,182,252,0.5) 0%,rgba(255,255,255,1) 100%);
        		}
        
        		/* Paper Wind Mill */
        		.wind-mill{
        			position: absolute;
        			overflow: hidden;
        			width: 327px;
        			height: 560px;
        		}
        		.petal-wrap{
        			width: 327px;
        			height: 327px;
        			position: absolute;
        			top: 0;
        			left: 0;
        			right: 0;
        			margin: auto;
        			overflow: hidden;
        		}
        		.petal{
        			position: absolute;
        			width: 5em;
        			height:10.2em;
        			position: absolute;
        			.........完整代码请登录后点击上方下载按钮下载查看

网友评论0