css实现秋风落叶飘落动画效果代码-html代码-BFW代码库

css实现秋风落叶飘落动画效果代码

代码语言：html

所属分类：动画

代码描述：css实现秋风落叶飘落动画效果代码

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">




    <style>
        body {background: #222;}
        
        /* leaf animations */
        
        #leaves {position:relative;top:-50px;width:100%;text-align: right;}
        
        #leaves i {
            display: inline-block;
            width: 200px;
            height: 150px;
            background: linear-gradient(to bottom right, #309900, #005600);
            transform: skew(20deg);
            border-radius: 5% 40% 70%;
            box-shadow: inset 0px 0px 1px #222;
            border: 1px solid #333;
            z-index: 1;
            -webkit-animation: falling 5s 0s infinite;
        }
        
        #leaves i:nth-of-type(2n) { -webkit-animation: falling2 5s 0s infinite; }
        #leaves i:nth-of-type(3n) { -webkit-animation: falling3 5s 0s infinite; }
        
        #leaves i:before {
          position: absolute;
          content: �.........完整代码请登录后点击上方下载按钮下载查看