让ie也支持rgba效果

RGBa是一种在CSS中声明包含透明效果的颜色的方法,通过RGBa我们可以将一个元素设置为透明,而不会影响其子元素。老版本IE浏览器不支持,我们可以使用IE浏览器CSS渐变滤镜来实现同样的效果。

html {

background: rgba(0,0,0,0.5);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#7F000000,endColorstr=#7F000000);
}

原理及方法:
DXImageTransform.Microsoft.gradient
滤镜里的startColorstr参数值是#AARRGGBB形式的, 其中的AA是代表不透明度的十六进制,00表示完全透明,FF就是全不透明,化
成十进制的范围就是0~255,剩下的RRGGBB就是颜色的十六进制代 码。例子中
background: rgba(125, 0, 0, 0.5);表示的是50%不透明度的黑色背景。如何把50%的不透明度转换成十六制呢?很简
单,先计算#AA的的十进制x,x/255 = 50/100,解得x=50*255/100,然后再把x换算成十六进制,约等于7F。

时间: 2024-10-07 04:47:56

让ie也支持rgba效果的相关文章

让IE浏览器支持RGBa的背景色

RGBa是一种在CSS中声明包含透明效果的颜色的方法,通过RGBa我们可以将一个元素设置为透明,而不会影响其子元素.但是并非所有的浏览器支持RGBa的背景色,其中用户颇多的老版本IE浏览器就不支持,好在IE浏览器支持条件注释,我们可以抛弃RGB并使用IE浏览器的一个私有CSS滤镜来实现同样的效果.上代码: <!--[if IE]> <style type="text/css"> .color-block { background:transparent; fil

让ie浏览器支持RGBA颜色标准实现代码

RGB色彩模式(也翻译为"红绿蓝",比较少用)是工业界的一种颜色标准,是通过对红(R).绿(G).蓝(B)三个颜色通道的变化以及它们相互之间的叠加来得到各式各样的颜色的,RGB即是代表红.绿.蓝三个通道的颜色,这个标准几乎包括了人类视力所能感知的所有颜色,是目前运用最广的颜色系统之一. RGBA在RGB的基础上多了控制alpha透明度的参数.以上R.G.B三个参数,正整数值的取值范围为:0 – 255.百分数值的取值范围为:0.0% – 100.0%.超出范围的数值将被截至其最接近的取

IE6不支持圆角效果的解决办法

IE6(7/8)不支持border-radius属性,所以其中的圆角效果显示不出来,可以通过引用ie-css3.htc的方法解决. ie-css3.htc(点击可直接查看) 将文件放在放在页面的根目录下,并在css文件(或者<style>标签)中,加上 body { behavior:url("...ie-css3.htc"); } 放在其他目录下也行,注意路径对即可. 其它问题可参考官网:http://fetchak.com/ie-css3/ IE6不支持圆角效果的解决办

让mbox支持up效果

<!doctype html> <html> <head> <meta charset="utf-8"> <title>首页</title> <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" /> <

jQuery封装placeholder效果,让低版本浏览器支持该效果

页面中的输入框默认的提示文字一般使用placeholder属性就可以了,即: <input type="text" name="username" placeholder="请输入用户名" value="" id="username"/> 最多加点样式控制下默认文字的颜色 input::-webkit-input-placeholder{color:#AAAAAA;} 但是在低版本的浏览器却不支

鸿雁电器oa系统中决策支持模块效果

公司简单介绍 鸿雁电器是国内著名的建筑电器产品的生产.经营企业.同一时候也是国家863计划CIMS(计算机集成制造系统)应用project示范企业.浙江省高新技术企业.浙江省专利示范企业和杭州市信息化试点企业. 企业系统 泛微OA 数据库类型 SQL Server 需求描写叙述 鸿雁电器内眼下使用者一个较为复杂的业务管理系统,在销售业务这一块产生的明细数据非常多.而他们的管理系统难以实现这些明细数据的统计分析.所以引入了FineReport.通过对FineReport的使用开发,眼下已经非常好的

IE7&amp;IE8不支持rgba的方法

使用滤镜功能 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#BF000000,endColorstr=#BF000000); 我们需要留意的是StartColorStr和EndColorStr的值,前两位是十六进制的透明度,后面六位是十六进制的颜色. 十六进制的透明度换算方法:x=alpha*255 将计算的结果x转换成十六进制即可

ie6-ie8不支持opacity,rgba解决方法

半透明部分设置样式:opacity:0.7在ie9/ie10/ff/chrome/opera/safari显示正常. 但是这样在ie6-ie8中是不支持的,需要加上下面这句话: filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70); 这里的opacity是百分比的 opacity表示透明度,默认的范围是从0 到 100,他们其实是百分比的形式.也就是说,0代表完全透明,100代表完全不透明. 上面解决了透明度的问题.接下来,解决r

移动端支持平滑到顶部效果

jquery返回顶部,支持手机 效果体验:http://hovertree.com/texiao/mobile/6/ 在pc上我们很容易就可以用scrollTop()来实现流程的向上滚动的返回到顶部的动画,然后用到web移动端却没什么卵用,会出现滚动不流畅,卡顿,失灵等等现象. 这是因为移动端的scroll事件触发不频繁,有可能检测不到有<=0的情况 为此,移动端判断次数好些,下面是具体实现代码,兼容pc: <!DOCTYPE html> <html> <head>