用纯CSS3的animation制作雪花飘落 星星闪烁 按钮缩放 图片倾斜

雪花飘落：

//雪花飘落.snowDown {animation: snowDown 3s linear infinite normal;-webkit-animation: snowDown 3s linear infinite normal;position: relative;}@keyframes snowDown {from {opacity: 1;top: 0;}to {opacity: 0;top: 30em;}}

星星闪烁：

.starFlick {animation: starFlick 0.8s ease-out infinite;-webkit-animation: starFlick 0.8s ease-out infinite;}@keyframes starFlick {from {opacity: 1;}to {opacity: 0;}}

按钮缩放：

.ds_Btn {animation: ds_Btn 1.5s ease-in-out infinite;-webkit-animation: ds_Btn 1.5s ease-in-out infinite;}@keyframes ds_Btn {0% {transform: scale(1, 1);}25% {transform: scale(1.08, 1.08);}50% {transform: scale(1, 1);}100% {transform: scale(1, 1);}}.ql_Btn {animation: ql_Btn 1.5s ease-in-out infinite;-webkit-animation: ql_Btn 1.5s ease-in-out infinite;}@keyframes ql_Btn {0% {transform: scale(1, 1);}25% {transform: scale(1, 1);}50% {transform: scale(1, 1);}100% {transform: scale(1.08, 1.08);}}

图片倾斜波动：

.peopleImg {animation: peopleImg 1.5s linear infinite;}@keyframes peopleImg {0% {transform: skewY(0deg);-webkit-transform: skewY(0deg);}25% {transform: skewY(1deg);-webkit-transform: skewY(1deg);}50% {transform: skewY(0deg);-webkit-transform: skewY(0deg);}100% {transform: skewY(-1deg);-webkit-transform: skewY(-1deg);}}