css实现波浪渐变背景动画效果代码-html代码-BFW代码库

css实现波浪渐变背景动画效果代码

代码语言：html

所属分类：动画

代码描述：css实现波浪渐变背景动画效果代码

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

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

<head>
    <meta charset="UTF-8">
    <style>
        body {
    	margin:auto;
    	font-family:-apple-system,BlinkMacSystemFont,sans-serif;
    	overflow:auto;
    	background:linear-gradient(315deg,rgba(101,0,94,1) 3%,rgba(60,132,206,1) 38%,rgba(48,238,226,1) 68%,rgba(255,25,25,1) 98%);
    	animation:gradient 15s ease infinite;
    	background-size:400% 400%;
    	background-attachment:fixed
    }
    @keyframes gradient {
    	0% {
    	background-position:0 0
    }
    50% {
    	background-position:100% 100%
    }
    100% {
    	background-position:0 0
    }
    }.wave {
    	background:rgb(255 255 255 / 25%);
    	border-radius:1000% 1000% 0 0;
    	position:fixed;
    	width:200%;
    	height:12em;
    	animation:wave 10s -3s linear infinite;
    	transform.........完整代码请登录后点击上方下载按钮下载查看