鼠标按下时的 CSS

Question

通常我会使用 :hover，但我希望我的网站也可以在触摸屏媒体上访问。

我知道我可以使用 :active，但是一旦我松开鼠标按钮，它就会回到非事件状态。

实际上我想要:

Mouse Down : Div goes green

Mouse Up: Div stays green

Mouse Down: Div goes red

Mouse Up: Div stays red

代替:

Mouse Down: Div goes green

Mouse Up: Div goes red

Answer 1

不依赖 jQuery:

:active 伪类用于在元素被点击时将 css 应用到元素。

.button {
  color: red;
}
.button:active {
  color: green;
}