css3 【无标题】很有趣的一个个CSS小球下落动画

代码如下

.ball {

width: 30px;

height: 30px;

background-color: black;

border-radius: 50%;

position: relative;

left: 90px;

animation: failing 0.5s ease-in infinite alternate;

}

.ground {

width: 200px;

height: 10px;

background-color: black;

}

@keyframes failing {

0% {

transform: translateY(-150px) scale(1, 1);

}

90% {

transform: scale(0.8, 1.2);

}

100% {

transform: translateY(0) scale(1.2, 0.8);

}

}

参考文章