今天分享前端代码主题:jequery控制css图片透明度很多时候在网站图片处理上需要实现一些辅助效果,比如鼠标在图片上滑动时或点击时改变图片颜色(变灰或者其他),其实一个简单的办法就是改变图片css透
顺晟科技
2022-09-13 13:24:20
152
1、rgba 描述
rgb:红r、绿g、蓝b
rgba:红r、绿g、蓝b、透明度Alpha
取值:
r、g、b值:正整数(0 ~ 255) | 百分数( 0.0% ~ 100.0%);(超出范围的数值将被截至其最接近的取值极限。并非所有浏览器都支持使用百分数值。)
a透明度值:取值0~1之间;(不可为负)
2、rgba 兼容
3、rgba 用法
rgba:制作透明色(透明背景色、透明边框色、透明前景色等),
opacity:在CSS2中制作背景色通常用到,但用它制作边框色或前景色的话,则存在问题。
在CSS2中 兼容 写法:
/* IE5 - 7 */ filter: alpha(opacity=80); /* IE 8 */ -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; /* Everyone else */ opacity: 0.8;
CSS3中 兼容写法:
background: rgb(0,0,0); /*The Fallback color,这里也可以使用一张图片来代替*/ background: rgba(0, 0, 0,0.5); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr=#80000000,endColorstr=#80000000)"; /*Filter for IE8 */ filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr=#80000000, endColorstr=#80000000); /*Filter for older IEs */
14
2022-09
13
2022-09
13
2022-09
13
2022-09
13
2022-09
13
2022-09