div+css布局实现野外露营烤火昼夜循环效果代码-html代码-BFW代码库

div+css布局实现野外露营烤火昼夜循环效果代码

代码语言：html

代码描述：div+css布局实现野外露营烤火昼夜循环效果代码

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

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <style>
        body
    {
      background-color:#1F4769;
       animation: bg 30s infinite linear;
    }
    
    .land
    {
      position:absolute;
      top:60%;
      left:30%;
      width:500px;
      height:10px;
      background:#000;
       border-radius:10%;
    }
    .chimney
    {
      position:absolute;
        left:15%;
      width:40px;
      height:10px;
      background:#ff8c1a;
       border-radius:10%;
    }
    .fire1
    {
      position:absolute;
    bottom:0%;
      left:15%;
      width:8px;
      height:24px;
      background:#ff8c1a;
      border-radius:5px;
    }
    .fire2
    {
      position:absolute;
      bottom:55%;
      left:18.2%;
      width:8px;
      height:30px;
      background:#ff8c1a;
      border-radius:5px;
    }
    .fire3
    {
        position:absolute;
        bottom:54%;
        left:21.5%;
        width:8px;
        height:34px;
        background:#ff8c1a;
        border-radius:5px;
    }
    .stick1
    {
          position:absolute;
        bottom:44%;
        left:6%;
        width:7px;
        height:90px;
        background:#001;
        border-radius:5px;
    }
    .stick2
    {
      z-index:10;
          position:absolute;
        bottom:44%;
        left:30%;
        width:7px;
        height:90px;
        background:#001;
        border-radius:5px;
    }
    .stick3
    {
      z-index:10;
          position:absolute;
        bottom:800%;
        left:4%;
        width:150px;
        height:6px;
        background:#001;
        border-radius:5px;
    }
    .vessel
    {
      z-index:10;
          position:absolute;
        bottom:460%;
        left:15%;
        width:34px;
        height:34px;
      border-radius:5%;  
      border:solid #001;
    }
    .fluid
    {
      position:absolute;
     top:50%;
      width:35px;
        height:18px;
     background:#ff3300;
      border-radius:10%;
      
    }
    .wate.........完整代码请登录后点击上方下载按钮下载查看