CSS動畫效果是現代網頁設計中不可或缺的部分，好看的CSS動畫可以吸引用戶的眼球，提高網站的用戶體驗。下面將為大家介紹幾個好看的CSS動畫效果。

/* 1.閃爍效果 */
@keyframes blink {
50% {
opacity: 0.3;
}
}
.blink {
animation: blink 1s ease-in-out infinite;
}
/* 2.抖動效果 */
@keyframes shake {
0% {
transform: translate(0, 0);
}
20% {
transform: translate(-10px, 0);
}
40% {
transform: translate(10px, 0);
}
60% {
transform: translate(-10px, 0);
}
80% {
transform: translate(10px, 0);
}
100% {
transform: translate(0, 0);
}
}
.shake {
animation: shake 1s ease-in-out infinite;
}
/* 3.旋轉效果 */
@keyframes rotate {
to {
transform: rotate(360deg);
}
}
.rotate {
animation: rotate 2s infinite linear;
}
/* 4.漸變效果 */
@keyframes gradient {
0% {
background-position: 0%;
}
100% {
background-position: 100%;
}
}
.gradient {
animation: gradient 2s linear infinite;
background: linear-gradient(to left, red, orange, yellow, green, blue, purple);
background-size: 600% 600%;
}

以上是介紹的幾個好看的CSS動畫效果，使用它們可以讓網頁更加生動有趣，但同時需要注意過度使用會影響網站的性能，所以合理地運用CSS動畫效果才是最重要的。