css实现三角形变形动画效果代码

代码语言:html

所属分类:动画

代码描述:css实现三角形变形动画效果代码

代码标签: css 三角形 变形 动画

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


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

<head>

  <meta charset="UTF-8">
  

  
  
<style>
.a {
  width: 70vmin;
  height: 70vmin;
  background-image: repeating-conic-gradient(at top center, transparent 0 0deg, salmon 0 30deg, transparent 0 60deg, salmon 0 120deg, transparent 0 150deg, salmon 0 180deg);
  background-position: center;
  background-size: 35vmin 35vmin;
  -webkit-clip-path: polygon(50% 0, 100% 90%, 0 90%, 50% 0);
          clip-path: polygon(50% 0, 100% 90%, 0 90%, 50% 0);
  display: grid;
  place-content: center;
  -webkit-animation: 5s f infinite cubic-bezier(0.37, -0.68, 0.54, 1.45);
          animation: 5s f infinite cubic-bezier(0.37, -0.68, 0.54, 1.45);
}
.a:before {
  content: '';
  display: block;
  width: 70vmi.........完整代码请登录后点击上方下载按钮下载查看

网友评论0