在網頁開發中，經常需要實現一些交互效果。其中一種很常見的效果就是點擊按鈕后按鈕變色。這個效果的實現需要用到CSS。

首先，在HTML代碼中創建一個按鈕元素，并給它一個唯一的ID：

<button id="myButton">點擊按鈕</button>

接下來，在CSS中定義按鈕的樣式。我們需要給按鈕定義兩個不同的顏色：一個初始顏色和一個點擊后的顏色。這可以通過定義兩個不同的CSS類來實現：

.button {
background-color: #4CAF50;
color: white;
padding: 10px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
}
.button-clicked {
background-color: #E84C3D;
}

上面的代碼中，.button類定義了按鈕的初始樣式，.button-clicked類定義了按鈕被點擊后的樣式。我們可以看到，.button-clicked類中的背景顏色已經變成了紅色。

最后，我們需要使用JavaScript來處理按鈕的點擊事件，并添加/刪除button-clicked類，以改變按鈕的樣式。以下是一個簡單的JavaScript腳本：

document.getElementById("myButton").addEventListener("click", function() {
document.getElementById("myButton").classList.toggle("button-clicked");
});

上面的代碼中，我們使用addEventListener方法將一個點擊事件綁定到按鈕上。這個事件觸發時，我們會切換button-clicked類的存在，從而改變按鈕的樣式。