CSS3文字動畫效果可以讓你的網站更加生動有趣。下面我們來學習幾個常用的CSS3文字動畫效果。

/* 文字淡入淡出 */
.fade-in-out {
opacity: 0;
animation: fadeInOut 2s ease-in-out infinite;
}
@keyframes fadeInOut {
0% {
opacity: 0;
}
50% {
opacity: 1;
}
100% {
opacity: 0;
}
}
/* 文字旋轉 */
.spin {
display: inline-block;
animation: spin 2s linear infinite;
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
/* 文字彈出 */
.pop-up {
position: relative;
animation: popUp 1s ease-in-out forwards;
}
@keyframes popUp {
0% {
transform: translateY(100%);
}
50% {
transform: translateY(-10%);
}
100% {
transform: translateY(0);
}
}

通過使用這些CSS3文字動畫效果，您可以增強您網站的視覺效果，并更加吸引用戶的眼球。以上代碼只是示例，請根據您自己的需求來修改和調整。