道理很简单,看代码
@-webkit-keyframes btnActive {
0% {
background-color:#999;
color:#FFFFFF;
}
100% {
background-color:#e6e6e6;
color:#999;
}
}
#formLogin input[type=button]:active {
-webkit-animation-name:btnActive;
-webkit-animation-duration:0.3s;
-webkit-animation-timing-function:linear;
background-color:#e6e6e6;
position:relative;
top:1px;
color:#999;
}
或者,设置-webkit-animation-fill-mode为forwards
兼容性:
支持版本\类型 | |||||
---|---|---|---|---|---|
版本 | 6.0-9.0 | 4.0 | 5.1 | 13.0-16.0 | 11.50-11.60 |
版本 | 10.0 | 5.0-9.0 |
详细见css手册:http://css.doyoe.com/properties/animation/animation-fill-mode.htm