心形爆炸效果-html代码-BFW代码库

心形爆炸效果

代码语言：html

所属分类：动画

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


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<title> - Exploding Low Poly Heart Container</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
<style>
    @import url("https://fonts.googleapis.com/css?family=Cabin+Sketch");
html {
  box-sizing: border-box;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

body {
  height: 100vh;
  background-color: #d5f3e6;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

#canvas {
  height: 100vh;
  width: 100vw;
}

text {
  font-family: 'Cabin Sketch', cursive;
  font-size: 96px;
  fill: #991F1F;
  text-anchor: middle;
  user-select: none;
}

  </style>

</head>
<body translate="no">
<svg version="1.1" id="canvas" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2560 1440">
<defs>
<filter id="blur" x="-150%" y="-150%" width="280%" height="280%" color-interpolation-filters="sRGB">
<feGaussianBlur id="gBlur" in="SourceGraphic" stdDeviation="0" />
</filter>
</defs>
<text id="text" x="1250" y="770" style="">Click Me!</text>
<g id="heart&quo.........完整代码请登录后点击上方下载按钮下载查看