CSS Gradient动画不起作用

Question

我正在尝试制作动画CSS渐变背景,我在此页面上为渐变生成CSS:http://www.gradient-animator.com/ 这是css:

body {
background: linear-gradient(270deg, #18f0b8, #18a2f0, #db5640);
background-size: 600% 600%;
-webkit-animation: Gradient 60s ease infinite;
-moz-animation: Gradient 60s ease infinite;
animation: Gradient 60s ease infinite;
@-webkit-keyframes Gradient {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@-moz-keyframes Gradient {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@keyframes Gradient { 
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
}

它输出的梯度很好,但它不会生成动画.我错过了什么吗？这是小提琴:http://jsfiddle.net/9s9g6ktu/

Answer 1

是的......你必须关闭你的bodycss并自己设置你的关键帧动画.喜欢这个http://jsfiddle.net/9s9g6ktu/1/