css实现windows图标旋转loading加载动画效果代码-html代码-BFW代码库

css实现windows图标旋转loading加载动画效果代码

代码语言：html

代码描述：css实现windows图标旋转loading加载动画效果代码

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


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

<head>

  <meta charset="UTF-8">
  

  
  
  
<style>
.opposites {
  position: relative;
  width: 60px;
  height: 60px;
}
.opposites {
  animation: opposites 2.5s ease-out 0s infinite;  
}
.tl, .tr, .br, .bl {
  width: 30px;
  height: 30px;
  position: absolute;
}
.tl, .tr {
  top: 0; 
}
.tr, .br {
  left: 30px; 
}
.tl, .br {
  animation: tlbr 2.5s ease-out 0s infinite;
}
.br, .bl {
  top: 30px; 
}
.tl, .bl {
  left: 0; 
}
.tr, .bl {
  animation: trbl 2.5s ease-out 0s infinite;
}
.tl {
  background: red;
  transform-origin: bottom right;
}
.tr {
  background: green; 
  transform-origin: bottom left;
}
.br {
  background: dodgerblue; 
  transform-origin: top left;
}
.bl {
  background: gold; 
  transform-origin: top right;
}

@keyframes tlbr {
  0% {transform: ro.........完整代码请登录后点击上方下载按钮下载查看