CSS3 Flash動畫

在網頁設計中，動畫可以增加網頁的趣味性，吸引用戶眼球，CSS3可以實現各種動畫效果，比如我們要介紹的Flash動畫效果。

Flash動畫是一種逐幀動畫，CSS3利用animation屬性可以實現逐幀動畫。

下面是一個使用CSS3實現的Flash動畫的代碼示例：

@keyframes flash {
0% {
opacity: 1;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.flash {
animation-name: flash;
animation-duration: 1s;
animation-iteration-count: infinite;
animation-fill-mode: both;
}

上面的代碼中，我們使用了@keyframes和animation屬性來實現一個簡單的Flash動畫。@keyframes定義了動畫的關鍵幀，從0%到100%表示動畫的整個過程，這里我們定義了三個關鍵幀，分別對應閃爍的三個狀態。flash類是要添加動畫效果的元素，animation-name表示動畫的名稱，和@keyframes定義的名稱對應，animation-duration表示動畫的持續時間，這里我們設置為1s，表示1秒鐘內完成動畫，animation-iteration-count表示動畫的循環次數，這里我們設置為infinite表示無限循環，animation-fill-mode表示動畫完成后，元素的樣式是否恢復為動畫前的樣式，這里我們設置為both表示元素的樣式將會在動畫開始前和結束后都生效。