html - 如何使用 CSS3 更改图像的颜色？

Question

这个有效:

a { color: hsla(0,100%,50%,0.2) }

这不是:

img { color: hsla(0,100%,50%,0.2) }

是否有像 img { opacity: 1 } 这样的东西允许为图像定义 hsl 值？

Answer 1

文字和图片是两种不同的东西。

文本由浏览器根据您提供的设置呈现(装饰、大小、字体颜色……)

图像以另一种方式呈现。浏览器没有关于图像内容的信息，因此不能改变图像本身。

颜色等参数不会对图像产生影响。

顺便说一句，颜色参数定义了文本颜色。

编辑:如果您想将“颜色”应用于图像，您可以创建一个带有背景图像的 div，然后在该 div 中创建另一个带有背景颜色和不透明度的 div。这样透明颜色就会覆盖在图像上。