在現代網頁設計中，美觀的界面和流暢的動畫效果是用戶最為關注的。而CSS的特效動畫技術便是制作頁面動畫的一種重要工具。以下是幾個常用的CSS特效動畫代碼。

/* 1. 點擊按鈕旋轉動畫 */
.btn{
transition: transform 0.5s;
}
.btn:hover{
transform: rotateY(180deg);
}
/* 2. 文字漸變效果 */
.text{
background: linear-gradient(to right, #8cfa9f, #0cf799);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
/* 3. 圖片放大效果 */
.img{
transition: all 0.5s;
}
.img:hover{
transform: scale(1.2);
}
/* 4. 按鈕點擊出現光暈效果 */
.btn{
position: relative;
}
.btn::after{
content: "";
position: absolute;
z-index: -1;
background: #00ff7f;
opacity: 0;
width: 100%;
height: 100%;
top: 0;
left: 0;
transition: all 0.5s;
}
.btn:hover::after{
opacity: 0.4;
}
/* 5. 圖片左右晃動效果 */
.img{
animation: shake 0.5s;
}
@keyframes shake{
0%{transform: translateX(0);}
25%{transform: translateX(-10px);}
50%{transform: translateX(0);}
75%{transform: translateX(10px);}
100%{transform: translateX(0);}
}

通過以上代碼可以看出，CSS特效動畫具有語法簡單、易于調整、兼容性好等優點。將這些特效應用于網頁設計時，可以使得網站更加生動有趣，也可以為用戶提供更為舒適的瀏覽體驗。