在網(wǎng)頁(yè)中，F(xiàn)lash 動(dòng)畫(huà)是一種非常流行的方式來(lái)添加吸引人的動(dòng)態(tài)效果。但是，隨著 HTML5 和 CSS3 的普及，我們也可以通過(guò) CSS 來(lái)實(shí)現(xiàn)一些同樣的效果。

下面，我們就來(lái)演示一下如何用 CSS 實(shí)現(xiàn)一個(gè)簡(jiǎn)單的 Flash 動(dòng)畫(huà)效果吧！

.flash {
width: 100px;
height: 100px;
background-color: #fff;
border: 1px solid #ccc;
padding: 20px;
text-align: center;
position: relative;
overflow: hidden;
animation: flash-normal 0.5s ease-in-out;
animation-iteration-count: infinite;
}
.flash:before {
content: '';
display: block;
position: absolute;
top: -50%;
left: -50%;
width: 200%;
height: 200%;
background-color: #fff;
transform: rotate(45deg);
animation: flash-flash 0.5s ease-in-out;
animation-iteration-count: infinite;
}
@keyframes flash-normal {
0% {
opacity: 1;
}
50% {
opacity: 0.3;
}
100% {
opacity: 1;
}
}
@keyframes flash-flash {
0% {
opacity: 0;
}
50% {
opacity: 1;
}
100% {
opacity: 0;
}
}

上述代碼中，我們使用了 CSS3 動(dòng)畫(huà)的關(guān)鍵幀（@keyframes）來(lái)實(shí)現(xiàn)閃爍效果。同時(shí)，我們還使用了偽元素（::before）來(lái)實(shí)現(xiàn)旋轉(zhuǎn)效果。

然后，我們就可以將上述代碼加到我們需要添加閃爍效果的元素（比如按鈕）上：

<button class="flash">Click Me!</button>

最終效果如下：

通過(guò)上述方法，我們可以用 CSS 實(shí)現(xiàn)一些非常酷的動(dòng)畫(huà)效果，不用再依賴 Flash 插件了！