html – 具有颜色和透明度的CSS图像叠加

html – 具有颜色和透明度的CSS图像叠加,第1张

概述我试图弄清楚我是否可以像图片一样添加叠加层,并在不添加背景颜色的情况下更改不透明度.我没有运气,所以我想我会在这里问. 我想用那种不透明度把它变成红色.这是我到目前为止所拥有的. 如果我必须调用overlay.png但我不知道它是否必要,我制作了一个覆盖它的图像. img.highlighted { opacity:0.4;} 基本上我想要做到这一点,但反过来,因为图像在徘徊时不会在徘徊时 我试图弄清楚我是否可以像图片一样添加叠加层,并在不添加背景颜色的情况下更改不透明度.我没有运气,所以我想我会在这里问.
我想用那种不透明度把它变成红色.这是我到目前为止所拥有的.

如果我必须调用overlay.png但我不知道它是否必要,我制作了一个覆盖它的图像.

img.highlighted {   opacity:0.4;}

基本上我想要做到这一点,但反过来,因为图像在徘徊时不会在徘徊时消除色调.
看看这里
http://jsbin.com/igahay/3011/edit

解决方法 如果你可以使用CSS3,请尝试使用CSS:filter ans special -webkit-filter
(这不是一个完全跨浏览器的解决方案……)
<img src="image.jpg" /><style>   img:hover {      -webkit-filter: hue-rotate(240deg) saturate(3.3);    }</style>

这里有一些在线演示:

> CSS Filter Effects
> Say Hello to Webkit Filters
> More on
google…

希望它有所帮助..或者至少指出你正确的方向.

总结

以上是内存溢出为你收集整理的html – 具有颜色和透明度的CSS图像叠加全部内容,希望文章能够帮你解决html – 具有颜色和透明度的CSS图像叠加所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1107296.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-28
下一篇 2022-05-28

发表评论

登录后才能评论

评论列表(0条)

保存