css3字体闪烁炫酷,css3 scale动画 字体、输入框等会闪烁，怎么解决？

画图

@-moz-keyframes loginAnimation {

from {

opacity: 0;

-moz-transform: scale(2);

}

to {

opacity: 1;

-moz-transform: scale(1);

}

}

@-ms-keyframes loginAnimation {

from {

opacity: 0;

-ms-transform: scale(2);

}

to {

opacity: 1;

-ms-transform: scale(1);

}

}

@-webkit-keyframes loginAnimation {

from {

opacity: 0;

-webkit-transform: scale(2);

}

to {

opacity: 1;

-webkit-transform: scale(1);

}

}

@-o-keyframes loginAnimation {

from {

opacity: 0;

-webkit-transform: scale(2);

}

to {

opacity: 1;

-webkit-transform: scale(1);

}

}

@keyframes loginAnimation {

from {

opacity: 0;

transform: scale(2);

}

to {

opacity: 1;

transform: scale(1);

}

}

body, div, svg {

margin: 0;

padding: 0;

}

.login {

font-size: 50px;

text-align: center;

top: 20%;

position: absolute;

left: 40%;

-webkit-animation: loginAnimation 2s both;

-o-animation: loginAnimation 2s both;

animation: loginAnimation 2s both;

opacity: 0;

}

xx管理系统

btn

请问一下，以上代码，动画过程中，字体 和输入框会闪烁，要怎么解决？

有另外一个问题是，这个代码用ie打开的时候，需要重新刷新一次才有这个css3的动画，这是什么原因？