css - 悬停时将图像从灰色变为真正的深黑色

Question

当我将鼠标悬停在图像上时，我希望它变黑。图像默认为灰色。

img:hover {
  filter: grayscale(100%) brightness(1.6) saturate(2) contrast(150);
}

<img src="/image/wpQiz.png">

Answer 1

使用反转滤镜，你会更接近:

img:hover {
 filter: invert(1);
}

<img src="/image/wpQiz.png" >

或者只是brightness(0)

img:hover {
 filter: brightness(0);
}

<img src="/image/wpQiz.png" >