div+css实现预加载条形波纹动画效果代码-html代码-BFW代码库

div+css实现预加载条形波纹动画效果代码

代码语言：html

代码描述：div+css实现一个预加载条形波纹上下起伏动画效果代码

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

<!DOCTYPE html>

<html lang="en">

<head>




    <style>
        html {
          font-size: 10px;
        }
        
        @media only screen and (max-width:400px) {
          html {
            font-size: 9.411764705882353px;
          }
        
        }
        
        body {
          background: #111111;
          font-family: "metropolis-regular", sans-serif;
          font-size: 1.7rem;
          font-style: normal;
          font-weight: normal;
          line-height: 1.765;
          color: #757575;
          margin: 0;
          padding: 0;
        }
        
        
        
        
        
        #preloader {
          position: fixed;
          top: 0;
          left: 0;
          right: 0;
          bottom: 0;
          background: #050505;
          z-index: 800;
          height: 100%;
          width: 100%;
          display: table;
        }
        
        .no-js #preloader,
        .oldie #preloader {
          display: none;
        }
        
        #loader {
          display: table-cell;
          text-align: center;
          vertical-align: middle;
        }
        
        .line-scale-pulse-out > div {
          background-color: #ec008c;
          width: 4px;
          height: 35px;
          border-radius: 2px;
          margin: 2px;
          -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
          display: inline-block;
          -webkit-animation: line-scale-pulse-out 0.9s -0.6s infinite cubic-bezier(0.85, 0.25, 0.37, 0.85);
          animation: line-scale-pulse-out 0.9s -0.6s infinite cubic-bezier(0.85, 0.25, 0.37, 0.85);
        }
        
        .line-scale-pulse-out .........完整代码请登录后点击上方下载按钮下载查看