CSS3 警報燈動畫是一種非常實用的技術，可以為網站設置非常醒目的警報效果。下面我們來介紹一下如何使用 CSS3 來實現這一效果：

/* CSS3 警報燈動畫 */
.alert {
width: 100px;
height: 100px;
background-color: #f00;
border-radius: 50%;
animation: alert 1s ease-in-out infinite;
}
@keyframes alert {
0% {
box-shadow: 0 0 0 0 rgba(255, 0, 0, 0.6);
}
70% {
box-shadow: 0 0 0 10px rgba(255, 0, 0, 0);
}
100% {
box-shadow: 0 0 0 0 rgba(255, 0, 0, 0);
}
}

在上面的代碼中，我們使用了 CSS3 動畫技術來實現警報燈的閃爍效果。首先，我們創建了一個初始狀態為紅色的圓形 div 元素，并為其添加了 animation 屬性，表示該元素需要應用 alert 動畫。

接著，我們定義了 alert 動畫，其中使用了 @keyframes 規則來定義動畫的關鍵幀，即從開始到結束時的所有變化。在這個動畫中，我們首先定義了 0% 的關鍵幀，表示動畫開始時的狀態。在這個狀態下，我們使用 box-shadow 屬性來添加一個紅色的投影效果，模擬警報燈的光芒。接著我們定義了第二個關鍵幀，70%，表示動畫進行到 70% 時的狀態。在這個狀態下，我們將投影效果逐漸從實心變為了透明，讓燈光顯得更加真實。最后，我們定義了 100% 關鍵幀，表示動畫結束時的狀態。在這個狀態下，我們將投影效果完全去掉，讓圓形元素變回紅色。通過不斷重復這個動畫，就可以實現一個非常醒目的警報燈效果了。