css+svg实现熔岩灯动画效果代码
代码语言:html
所属分类:动画
代码描述:css+svg实现熔岩灯动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> body{ height:100vh; width:100vw; background-image:radial-gradient(purple, #D16EA4); margin:0 auto; overflow:hidden; } .lamp{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); height:300px; width:300px; } h1{ font-family: 'Boogaloo', cursive; text-align:center; color:rgba(255,255,255,0.05); font-size:5em; z-index:-1; position:absolute; top: 50%; left:50%; transform:translate(-50%) rotate(-4deg); } </style> </head> <body> <svg class="lamp" viewBox="-21 0 100 125"> <defs> <filter id="goo"> <feGaussianBlur in="SourceGraphic" stdDeviation="4" result="color-matrix-blur"></feGaussianBlur> <feColorMatrix in="blur&qu.........完整代码请登录后点击上方下载按钮下载查看
网友评论0