记录一下,misubmit为我博客留言的按钮。下面引用的代码可以直接使用。

#misubmit {background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);background-size: auto;background-size: 1000% 1000%;animation: gradientBG 30s ease infinite;}

/* 动画,控制背景 background-position */
@keyframes gradientBG {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}

下面是思路

先设置渐变背景: background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);变化角度和颜色

设置背景尺寸比容器大几倍:background-size: 1000% 1000%;

再搞个循环动画,控制背景移动:background-position