animation 属性

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/caishu1995/article/details/82252558

animation 属性是一个简写属性，用于设置六个过渡属性：

animation-duration         animation-timing-function
animation-delay （这三个应该能猜出来吧，同上）
animation-name（绑定的 keyframe 名称）
animation-iteration-count（播放次数。 次数（n） | infinite无限）
animation-direction（是否播放反向动画。normal | alternate）

p{
	animation:pMove 1s infinite;
	-moz-animation:pMove 1s infinite;    /* Firefox */
	-webkit-animation:pMove 1s infinite; /* Safari and Chrome */
	-o-animation:pMove 5s infinite;      /* Opera */
}

@keyframes pMove{
    /*设置不同时段的动画*/
	0%   { color: yellow; transform: scale(1);  }
	25%  { color: white; transform: scale(1.1); }
	50%  { color: yellow; transform: scale(1);  }
	75%  { color: white; transform: scale(1.1); }
	100% { color: yellow; transform: scale(1);  }
}
@-moz-keyframes pMove /* Firefox */{ /*同上，只是为了兼容*/}
@-webkit-keyframes pMove /* Safari and Chrome */{ /*同上，只是为了兼容*/}
@-o-keyframes pMove /* Opera */{ /*同上，只是为了兼容*/}