兼容ie8 rgba()用法

<!--[if IE]>

<style type="text/css">

.mark {

background:transparent;

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#c80e92cb,endColorstr=#c80e92cb);

zoom: 1;

}

</style>

<![endif]-->

DXImageTransform.Microsoft.gradient滤镜里的startColorstr参数值是#AARRGGBB形式的,其中的AA是代表不透明度的十六进制,00表示完全透明,FF就是全不透明,化成十进制的范围就是0~255,剩下的RRGGBB就是颜色的十六进制代码。例子中background: rgba(125, 0, 0, .3);表示的是30%不透明度的红色背景。如何把30%的不透明度转换成十六制呢?很简单,先计算#AA的的十进制x,x/255 = 3/10,解得x=3*255/10,然后再把x换算成十六进制,约等于4B。下面有rgba和IE下filter数值的转换,这样大家就不用计算了,直接参考数值就行。

RGBa颜色还可以用于border,不过,不同的浏览器对于border的RGBa支持不太一样,不过唯一的不同是,Firefox在border的拐角处会出现叠加,比如透明度是0.4,那么在Firefox中,四个角的透明度会变成0.8,而支持RGBa的非FF浏览器不会出现这种情况。

rgba透明值        iefilter值

0.1                  19

0.2                  33

0.3                  4C

0.4                  66

0.5                  7F

0.6                  99

0.7                  B2

0.8                  C8

0.9                  E5

时间: 2024-12-16 13:12:59

兼容ie8 rgba()用法的相关文章

兼容ie8 rgba()用法 滤镜filter的用法

原文  http://blog.csdn.net/westernranger/article/details/40836861 今天遇到了一个问题,要在一个页面中设置一个半透明的白色div.这个貌似不是难题,只需要给这个div设置如下的属性即可: background: rgba(255,255,255,.1); 但是要兼容到ie8.这个就有点蛋疼了.因为ie8不支持rgba()函数.下面我们总结一下rgba()函数的含义. rgba的含义,r代表red,g代表green,b代表blue,红绿蓝

css 兼容ie8 rgba()用法

今天遇到了一个问题,要在一个页面中设置一个半透明的白色div.这个貌似不是难题,只需要给这个div设置如下的属性即可: background: rgba(255,255,255,.1); 但是要兼容到ie8.这个就有点蛋疼了.因为ie8不支持rgba()函数.下面我们总结一下rgba()函数的含义. rgba的含义,r代表red,g代表green,b代表blue,红绿蓝是三原色.所有颜色都可以由这三种颜色拼合而成.a代表透明度.比如rgba(255,255,255,0.1)就是透明度为0.1的白

兼容ie8 rgba()写法

background: rgba(255,255,255,.1); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#19ffffff,endColorstr=#19ffffff); IE8中使用ie独有的filter来解决. filter的gradient的颜色"#19ffffff"是由两部分组成的. 第一部是#号后面的19 .是rgba透明度0.1的IEfilter值.从0.1到0.9每个数字对应一个I

透明度 background:rgba() 兼容IE8 ;边框只针对IE8 出现

.z_mask{ font-size: 13px; width: 100%; height: 100%; background: rgba(0,0,0,.5); -ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#BF000000,endColorstr=#BF000000)"; color: #fff; position: absolute; top: 0; text-align: center;

CSS3 线性渐变(linear-gradient) 兼容IE8,IE9

一.线性渐变在 Mozilla 下的应用     语法: 1 -moz-linear-gradient( [<point> || <angle>,]? <stop>, <stop> [, <stop>]* ) 参数:其共有三个参数,第一个参数表示线性渐变的方向,top 是从上到下.left 是从左到右,如果定义成 left top,那就是从左上角到右下角.第二个和第三个参数分别是起点颜色和终点颜色.你还可以在它们之间插入更多的参数,表示多种颜色的

兼容ie8的多选下拉选择框

说下写这个东东的原因:最近要写一个兼容ie8的项目,我一出来工作就是数据驱动的框架了.所以对不支持vue的ie8.真的是脑壳疼. 最后考察了一番,决定使用 layui这个官网宣城兼容人类正在使用的全部浏览器(IE6/7除外)的Ui 刚开始用着,好像也是挺香的,相对于其他兼容ie8的ui,各方面都好很多. 慢慢的,蛋疼的时候来了,就是layui的多选下拉对ie8不支持. 接着,就开始百度各种多选下拉插件(还是懒啊,啥都想用现成的),耗费大量精力测试修改,都不尽人意,好多都是标题单,宣称支持ie8,

ICG-智能代码生成器.(权限控制.融入平台).(表单引擎).(最低兼容IE8)

请下拉滚动条... 界面: 1--首先是server制作界面(BS结构).直接上图:   2--点击提交生成一下文件: 各个代表什么一看就懂了...... 3--把上面的文件放到对于的位置.然后编译.然后就ok了.... 打开client中的IBD中的loginin.aspx页面 用admin登陆.(admin未管理员.test为普通用户.这些在平台都可以设置) 登陆进来是这样:其中邮件和分组管理还有用户管理以及app管理都是平台自带的....看下图: 4--现在把刚才生成的app应用加入到平台

jQuery ajax 动态append创建表格出现不兼容ie8

很多情况下,通过js(jQuery1.10)动态来创建一些样式,对页面的动态交互来说是很方便的 但是不同的浏览器针对动态生成的不是很兼容,在此遇见的不兼容ie8,跟各位分享下 代码: json数据 data.json [{"name":"ajax","job":"manong"},{"name":"js","job":"diaosi"}] html

【转】让Bootstrap 3兼容IE8浏览器

FROM : http://www.ijophy.com/2014/05/bootstrap3-compatible-with-ie8.html 最近在研究Bootstrap(官方,Github)这个优秀的前端框架,Bootstrap最开始是Twitter团队内部的一个前端框架,所谓前端框架就是一个CSS/HTML框架,框架里面有下拉菜单.按钮组.按钮下拉菜单.导航.导航条.面包屑.分页.排版.缩略图.警告对话框.进度条.媒体对象等.Bootstrap他们预先定义好,等要进行正式制作网页的时候,