[分享]css做的一些动画效果

CSS作为一种前端技术，可以为网站添加很多有趣的动画效果。下面就来介绍一些常见的CSS动画效果：

/* 1. 悬停效果 */
a:hover {
    color: red;
    transition: color 0.5s ease;
}

/* 2. 旋转效果 */
.rotate {
    transition: transform 1s ease;
}

.rotate:hover {
    transform: rotate(360deg);
}

/* 3. 渐变效果 */
.gradient {
    background-image: linear-gradient(to right, red, yellow);
    transition: all 1s ease;
}

.gradient:hover {
    background-image: linear-gradient(to right, blue, green);
}

/* 4. 弹跳效果 */
.bounce {
    transform: scale(1);
    transition: transform 0.3s ease;
}

.bounce:hover {
    transform: scale(1.2);
    transition: transform 0.3s ease;
} 

以上是一些常见的CSS动画效果，你可以根据自己的需要进行调整。记得多加练习哦！