CSS設置懸停效果 懸停效果是網頁設計中常用的一種效果，它能讓頁面元素在鼠標懸停時產生變化，從而增強用戶交互性。本文將介紹 CSS 中如何設置懸停效果。 在 CSS 中，我們可以使用:hover 偽類來設置懸停效果。該偽類可以對任何 HTML 元素進行設置，而且可以與大多數 CSS 屬性一起使用。下面是一個示例，當鼠標懸停在 p 元素上時，文本顏色將變為紅色。

p:hover {
color: red;
}

同時，我們還可以結合其他 CSS 屬性來實現更炫酷的懸停效果。比如，在懸停時逐漸增加文本透明度，可以使用 opacity 屬性，如下所示：

p {
opacity: 0.5;
transition: opacity 0.5s; /* 啟用過渡動畫效果 */
}
p:hover {
opacity: 1;
}

這樣，當鼠標懸停在 p 元素上時，文本透明度將從 0.5 逐漸變為 1，產生一個漸變效果。 除此之外，我們還可以利用 CSS3 中的 transform 屬性實現更為豐富的懸停效果。例如，當鼠標懸停在按鈕上時，使其旋轉 360 度，可以通過如下 CSS 代碼實現：

button {
transform: rotate(0deg);
transition: transform 0.5s; /* 啟用過渡動畫效果 */
}
button:hover {
transform: rotate(360deg);
}

當然，以上僅是一些簡單的示例，通過掌握 CSS 中的偽類及相關屬性，我們可以實現各種酷炫的懸停效果，從而給網頁設計帶來不同尋常的體驗。