css实现蜡烛燃烧动画效果代码-html代码-BFW代码库

css实现蜡烛燃烧动画效果代码

代码语言：html

所属分类：动画

代码描述：css实现蜡烛燃烧动画效果代码

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">




    <style>
        body {
          background: rgb(21, 18, 54);
        }
        .container {
          display: flex;
          margin-top: 20%;
          margin-left: 40%;
          margin-right: 5%;
        }
        .diya1,
        .diya2,
        .diya3,
        .diya4,
        .diya5 {
          position: relative;
          width: 60px;
          height: 30px;
          background: linear-gradient(50deg, red, orange);
          border-radius: 15% 15% 50% 50%;
          box-shadow: 0px 5px 10px 0px rgb(85, 69, 40);
          z-index: 5;
        }
        .diya1 {
          transform: translateX(70%) translateY(300%);
        }
        .light1,
        .light2,
        .light3,
        .light4,
        .light5 {
          position: relative;
          width: 15px;
          height: 35px;
          background: linear-gradient(50deg, wheat, orange);
          border-radius: 50% 50% 50% 50%;
          box-shadow: 0px 5px 10px 0px rgb(85, 69, 40);
          z-index: 2;
          box-shadow: 2px 0px 15px 0px wheat;
          ani.........完整代码请登录后点击上方下载按钮下载查看