css - 如何仅使用 CSS 动态改变图像的色调？

Question

我有一个图像文件，我想针对不同的事件以不同的色调显示它。比如说按钮上的单击事件，我需要传递颜色代码，并且图像的色调必须是该颜色。我该如何做到这一点，最好只有CSS？

Answer 1

您可以尝试 css3 中提供的颜色混合功能。示例如下:

.blend {
  background-image:url(blend-mode-mult.jpg);
  width:450px;
  height:450px;
  background-color: #f79e9e;/*pass your color variable here*/
  background-blend-mode: multiply;
}