在网站的设计搭建中,我们可以给图片增加一些效果让网页变得更加灵动,比如当一张图片是圆形时,我们可以给图片增加一个旋转的效果。
<style>
.zz-comp-logo .logo__wrapper {
-webkit-animation: spin 100s linear infinite;
animation: spin 3s linear infinite;
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
transition: all 2s;
}
</style>
<style>
._13lcldp8co000 .zz-comp-list__item .img img {
-webkit-animation: spin 3s linear infinite;
animation: spin 3s linear infinite;
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
transition: all 2s;
}
</style>
好了,今天的小教程就到这里了,我们下期再见吧!
常见问题