svg温度滑动波纹动画效果代码

代码语言:html

所属分类:动画

代码描述:svg温度滑动波纹动画效果代码

代码标签: 波纹 动画 效果

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

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

<head>

  <meta charset="UTF-8">
  

  
<style>
body {
 background-color: #FCEFD6;
 overflow: hidden;
 text-align:center;
}
body,
html {
 height: 100%;
 width: 100%;
 margin: 0;
 padding: 0;
 overflow: hidden;
}

svg {
 
 width: 100%;
 height: 100%;
 
}

.label{
 fill:#FFFCF9;
 font-size:1.8em;
 font-family: "din-condensed-web", sans-serif;
 /* font-family: "filson-soft", sans-serif; */
 text-anchor:middle;
 letter-spacing:1.2px;
}


 .tubeLabel{
 fill:#FCEFD6;
 font-size:1.4em;
 font-family: "din-condensed-web", sans-serif;
 /* font-family: "filson-soft", sans-serif; */
 text-anchor:middle;
}
.dragger{
 -webkit-tap-highlight-color:transparent;
}
</style>



</head>

<body translate="no" >
  <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 800 600">
  <defs>
    <linearGradient id="liquidGrad" x1="557" y1="150" x2="557" y2="546" gradientUnits="userSpaceOnUse">
      <stop offset="0" stop-color="#FF0909"/>
      <stop offset="0.2" stop-color="#F3481A"/>
      <stop offset="0.5" stop-co.........完整代码请登录后点击上方下载按钮下载查看

网友评论0