我有以下代码用于“有弹性”的页面转换,但每次没有被注释掉时,整个 CSS 都会中断。在我更改一些关键帧之前它没有这样做,但现在我把它弄坏了,哈哈:(
有什么帮助吗?
body {
-webkit-animation-name: scalein;
-webkit-animation-duration: 750ms;
-webkit-animation-iteration-count: 1;
-webkit-animation-timing-function: linear;
-moz-animation-name: scalein;
-moz-animation-duration: 750ms;
-moz-animation-iteration-count: 1;
-moz-animation-timing-function: linear;
animation-name: scalein;
animation-duration: 750ms;
animation-iteration-count: 1;
animation-timing-function: linear;
}
@keyframes scalein {
1% {
transform: scale(0.1);
}
39% {
transform: scale(1.3);
}
50% {
transform: scale(0.5);
}
75% {
transform: scale(1.1);
}
85% {
transform: scale(0.9);
}
100% {
transform: scale(1);
}
}
@-webkit-keyframes scalein {
1% {
-webkit-transform: scale(0.1);
}
39% {
-webkit-transform: scale(1.3);
}
50% {
-webkit-transform: scale(0.5);
}
75% {
-webkit-transform: scale(1.1);
}
85% {
-webkit-transform: scale(0.9);
}
100% {
-webkit-transform: scale(1);
}
}
@-moz-keyframes scalein {
1% {
-moz-transform: scale(0.1);
}
39% {
-moz-transform: scale(1.3);
}
50% {
-moz-transform: scale(0.5);
}
75% {
-moz-transform: scale(1.1);
}
85% {
-moz-transform: scale(0.9);
}
100% {
-moz-transform: scale(1);
}
}
@-o-keyframes scalein {
1% {
-o-transform: scale(0.1);
}
39% {
-o-transform: scale(1.3);
}
50% {
-o-transform: scale(0.5);
}
75% {
-o-transform: scale(1.1);
}
85% {
-o-transform: scale(0.9;
}
100% {
-o-transform: scale(1);
}
}