CSS 的好處之一就是可以輕松地改變網頁上的元素外觀。其中一個簡單的效果就是鼠標經過按鈕時使其變色。下面是一些示例代碼，演示如何實現這個效果。

/* HTML 代碼 */
<button class="color-button">點擊我！</button>
/* CSS 代碼 */
.color-button {
background-color: #4CAF50;  /* 設置按鈕默認顏色 */
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
}
.color-button:hover {
background-color: #3e8e41;  /* 設置按鈕在鼠標經過時的顏色 */
}

代碼中，我們設置了一個 class 名稱為 "color-button" 的按鈕，并設置了它的屬性。當鼠標經過按鈕時，使用:hover 偽類選擇器來改變按鈕的背景顏色為另一種顏色。

如果想要使用不同的顏色變化效果，只需將 CSS 代碼中的顏色值改為想要的顏色即可。另外，可以通過將:hover 偽類選擇器應用到其他元素上，實現類似的效果，如鏈接、圖像等。

因此，使用 CSS 來改變網頁元素在鼠標經過時的外觀效果，能增加網站的用戶交互性和視覺吸引力，不妨也試試看吧！