CSS3 新特性——动画
.loading { animation: a1 2s linear infinite; }
@keyframes a1 {
to {
transform: rotate(360deg);
}
}
动画是使元素从一种样式逐渐变化为另一种样式的效果。
用百分比来规定变化发生的时间，或用关键词 “from” 和 “to”，等同于 0% 和 100%。
0% 是动画的开始，100% 是动画的完成。
@keyframes a1 {
0% { background: red; }
25% { background: yellow; }
50% { background: blue; }
100% { background: green; }
}
@keyframes a1 {
from { background: red; }
to { background: yellow; }
}
demo1-loading ☞
YouTube 视频
demo2-liner-loading ☞
