CSS給元素添加事件能夠使網頁更加交互性和動態化。

//HTML代碼
<button class="btn">點擊我</button>

現在我們要為這個按鈕添加一個鼠標點擊事件，當用戶點擊按鈕時，會彈出一個提示框。

//CSS代碼
.btn {
cursor: pointer;
}
.btn:active::after {
content: "你點擊了我！";
position: absolute;
top: 0;
left: 100%;
}

代碼解釋：

• cursor: pointer; 將鼠標的樣式設為手型，提示用戶該元素可以點擊。
• btn:active::after 當按鈕被點擊時，添加一個偽元素，通過絕對定位放到按鈕的右側。
• content: "你點擊了我！"; 偽元素里的內容是提示文本。

通過CSS給元素添加事件，我們可以避免在Javascript中編寫大量的代碼，同時也能夠減少網頁的加載時間和提高用戶體驗。