咸鱼呀 咸鱼呀
首页
  • 博客文章

    • node搭建简易cli
    • 一个好看的loading
    • CSS-笔记
    • git提交规范
    • JS工具函数-转载
    • Vue组件打包到发布流程
    • nuxt.js-相关配置信息
    • nvm-upgrade
    • NVM 安装 之 window
    • 正则常用表达式
    • vue 3.0 生命周期函数记录
    • vue 对IE的支持
    • vue入门技术分享
    • 解决ios端inout失焦时,底部白底
    • WebStorm配置本地测试服务器
  • 分类
  • 标签
  • 归档
关于
博客 (opens new window)
GitHub (opens new window)

s-xianyu

前端小白
首页
  • 博客文章

    • node搭建简易cli
    • 一个好看的loading
    • CSS-笔记
    • git提交规范
    • JS工具函数-转载
    • Vue组件打包到发布流程
    • nuxt.js-相关配置信息
    • nvm-upgrade
    • NVM 安装 之 window
    • 正则常用表达式
    • vue 3.0 生命周期函数记录
    • vue 对IE的支持
    • vue入门技术分享
    • 解决ios端inout失焦时,底部白底
    • WebStorm配置本地测试服务器
  • 分类
  • 标签
  • 归档
关于
博客 (opens new window)
GitHub (opens new window)
  • 学习笔记
s-xianyu
2020-01-04

一个好看的loading

img.png

直接上代码

.loading{
    display: inline-block;
    width: 51px;
    height: 51px;
    margin: 6px;
    border-radius: 50%;
    background: #ef3795;
    animation: lds-circle 2.4s cubic-bezier(0, 0.2, 0.8, 1) infinite;
  }

@keyframes lds-circle {
    0%, 100% {
      animation-timing-function: cubic-bezier(0.5, 0, 1, 0.5);
    }
    0% {
      transform: rotateY(0deg);
    }
    50% {
      transform: rotateY(1800deg);
      animation-timing-function: cubic-bezier(0, 0.5, 0.5, 1);
    }
    100% {
      transform: rotateY(3600deg);
    }
  }
编辑 (opens new window)
#css
上次更新: 3/10/2022, 3:57:03 AM
最近更新
01
开发一个个人的cli
02-26
02
nvm-upgrade
10-11
03
vue 3.0 生命周期函数记录
06-27
更多文章>
Theme by Vdoing | Copyright © 2022-2022 s-xianyu | 小站
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式