SMIL编写一个动画效果代码-html代码-BFW代码库

SMIL编写一个动画效果代码

代码语言：html

所属分类：动画

代码描述：SMIL编写一个动画效果代码

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


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

<head>

  <meta charset="UTF-8">
  

  
  
<style>
body {
  background: #030303;
}
svg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  height: 100px;
  width: 100px;
}
</style>




</head>

<body>
  <svg viewbox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg'>
    <defs>
        <linearGradient id='gradient1' x1='0' y1='0' x2='0' y2='1'>
            <stop offset='0%' stop-color='#ef476f' />
            <stop offset='100%' stop-color='#ffd166' />
        </linearGradient>
        <linearGradient id='gradient2' x1='0' y1='0' x2='0' y2='1'>
            <stop offset='0%' stop-color='#ffd166' />
            <stop offset='100%' stop-color='#06d6a0' />
        </linearGradient>
        <linearGradient id='gradient3' x1='0' y1='0' x2='0' y2='1'>
            <stop offset='0%' stop-color='#118ab2' />
            <stop offset='100%' stop-color='#ef476f' />
        </linearGradient>
        <mask id='mask1'>
            <g transform='translate(50, 50)'>
                <g>
                    <animateTransform attributeType='XML' attributeName='transform' type='rotate' dur='8s' repeatCount='indefinite' values='0;90;180;270' calcMode='discrete' />
                    <g transform='translate(-50,-50)'>
                        <line x1='20' x2='20' y1='20' y2='20' stroke=&.........完整代码请登录后点击上方下载按钮下载查看