CSS中定義鼠標懸停后背景顏色的方法

在CSS中，我們可以使用:hover偽類來定義鼠標懸停時的樣式，包括背景顏色的變化，下面是一個簡單的例子：

/* 定義一個div元素，鼠標懸停時背景顏色變?yōu)榧t色 */
div {
  width: 200px;
  height: 200px;
  background-color: blue;
}
div:hover {
  background-color: red;
}

在這個例子中，我們定義了一個div元素，它的背景顏色是藍色，當鼠標懸停在div上時，背景顏色會變?yōu)榧t色，這是通過:hover偽類實現(xiàn)的，它可以讓***自定義鼠標懸停時的樣式。

除了背景顏色，你還可以定義其他樣式，比如邊框顏色、字體顏色等，下面是一個更全面的例子：

div {
  width: 200px;
  height: 200px;
  background-color: blue;
  border: 1px solid black;
  color: white;
}
div:hover {
  background-color: red;
  border-color: red;
  color: black;
}

在這個例子中，我們定義了一個div元素，它的背景顏色是藍色，邊框是黑色，字體顏色是白色，當鼠標懸停在div上時，背景顏色會變?yōu)榧t色，邊框顏色也會變?yōu)榧t色，字體顏色會變?yōu)楹谏?/p>

需要注意的是，這種方法只適用于支持CSS樣式的瀏覽器，由于:hover偽類是用于定義鼠標懸停時的樣式，因此它只在鼠標懸停時生效，當鼠標離開時，樣式會恢復為原來的樣式。