CSS實(shí)現(xiàn)點(diǎn)擊變紅

在CSS中，我們可以使用:active偽類來實(shí)現(xiàn)點(diǎn)擊元素時(shí)使其變紅的效果。:active偽類用于匹配處于活動(dòng)狀態(tài)的元素，即元素正在被用戶點(diǎn)擊或觸摸。

以下是一個(gè)簡(jiǎn)單的示例，展示了如何使用CSS實(shí)現(xiàn)點(diǎn)擊變紅的效果：

HTML代碼：

<button class="my-button">點(diǎn)擊我</button>

CSS代碼：

.my-button {
  background-color: #ccc;
  color: #333;
  padding: 10px 20px;
  border: none;
  cursor: pointer;
}
.my-button:active {
  background-color: #f00;
  color: #fff;
}

在這個(gè)示例中，我們定義了一個(gè)帶有類名my-button的按鈕，在CSS中，我們使用了:active偽類來定義按鈕在被點(diǎn)擊時(shí)的樣式，當(dāng)按鈕被點(diǎn)擊時(shí)，它的背景顏色會(huì)變成紅色（#f00），文字顏色會(huì)變成白色（#fff）。

在實(shí)際應(yīng)用中，您可能需要根據(jù)自己的需求來調(diào)整樣式和顏色，為了確保點(diǎn)擊效果能夠正常顯示，您可能需要在JavaScript中阻止按鈕的默認(rèn)點(diǎn)擊事件。