我正在尝试将动画渐变应用于我的标题类。由于某种原因,我无法让这个工作。
我试图这样做但不是身体,只是标题。 https://www.gradient-animator.com/
这里发生了什么?任何人都可以帮助我指出正确的方向吗?
HTML,CSS
docker run --rm -p 0.0.0.0:2181:2181 -p 0.0.0.0:9092:9092 -p 0.0.0.0:8081:8081
--env ADVERTISED_HOST=`docker-machine ip \`docker-machine active\`` --env
ADVERTISED_PORT=9092 -v
/Users/abhishek.srivastava/MyProjects/KafkaTest/target/scala-2.11:/app -it --
name kafka kafka_9.0 bash
.business-header {
background: linear-gradient(50deg, #282466, #ffc500);
height: 400px;
-webkit-animation: test 2s ease infinite;
animation: test 2s ease infinite;
}
@-webkit-keyframes test {
0%{background-position:51% 0%}
50%{background-position:20% 100%}
100%{background-position:51% 0%}
}
@-moz-keyframes test {
0%{background-position:51% 0%}
50%{background-position:50% 100%}
100%{background-position:51% 0%}
}
@keyframes test {
0%{background-position:51% 0%}
50%{background-position:50% 100%}
100%{background-position:51% 0%}
}
答案 0 :(得分:0)
.business-header {
background: linear-gradient(270deg, #a4ffe8, #092f25);
background-size: 400% 400%;
-webkit-animation: AnimationName 30s ease infinite;
-moz-animation: AnimationName 30s ease infinite;
animation: AnimationName 30s ease infinite;
min-height: 100%;
min-width: 100%;
height:400px;
}
你没有提到背景大小..这就是问题