借鉴。。。。。。。。。。。。。。。。。

在调试ie8兼容性的问题时，发现ie8不支持rgba。

关于rgba()，即为颜色设置的方法函数，rgb代表颜色，a代表透明度。

如rgba(0,0,0,0.1)表示透明值为0.1的黑色。

  1. <div style="height:100px;width:100px;rgba(196, 50, 61,0.7)"></div>

如上，是一个红色透明的正方形的方块，但在ie8中不能正常显示，只能显示成一个透明的模块，也就是看不见了。

这时就需要使用ie的filter来解决rgba的问题，从网上看到这样一句解决写法：

  1. <div style="height:100px;width:100px;rgba(196, 50, 61,0.7);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#B2C4323D,endColorstr=#B2C4323D);"></div>

这里的#B2C4323D是对颜色和透明度设置。#后前两位是对透明度的设置，而接下来的6位是16进制的颜色设置。

关于透明度和IEfilter之间的换算：

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

下面是RGB颜色与16进制颜色的换算方法：

比如rgb(196, 50, 61)，

196/16等于12余4，12对应的是C，所以196对应的值C4，

50/16等于3余2，所以对应的值为32，

61/16等于3余13，所以对应的值为3D。

因此rgb(196, 50, 61)对应的值为#C4323D。

下面是RGB颜色与16进制颜色的换算表：

RGB HEX
0 00
1 01
2 02
3 03
4 04
5 05
6 06
7 07
8 08
9 09
10 0A
11 0B
12 0C
13 0D
14 0E
15 0F
16 10
17 11
18 12
19 13
20 14
21 15
22 16
23 17
24 18
25 19
26 1A
27 1B
28 1C
29 1D
30 1E
31 1F
32 20
33 21
34 22
35 23
36 24
37 25
38 26
39 27
40 28
41 29
42 2A
43 2B
44 2C
45 2D
46 2E
47 2F
48 30
49 31
50 32
51 33
52 34
53 35
54 36
55 37
56 38
57 39
58 3A
59 3B
60 3C
61 3D
62 3E
63 3F
64 40
65 41
66 42
67 43
68 44
69 45
70 46
71 47
72 48
73 49
74 4A
75 4B
76 4C
77 4D
78 4E
79 4F
80 50
81 51
82 52
83 53
84 54
85 55
86 56
87 57
88 58
89 59
90 5A
91 5B
92 5C
93 5D
94 5E
95 5F
96 60
97 61
98 62
99 63
100 64
101 65
102 66
103 67
104 68
105 69
106 6A
107 6B
108 6C
109 6D
110 6E
111 6F
112 70
113 71
114 72
115 73
116 74
117 75
118 76
119 77
120 78
121 79
122 7A
123 7B
124 7C
125 7D
126 7E
127 7F
128 80
129 81
130 82
131 83
132 84
133 85
134 86
135 87
136 88
137 89
138 8A
139 8B
140 8C
141 8D
142 8E
143 8F
144 90
145 91
146 92
147 93
148 94
149 95
150 96
151 97
152 98
153 99
154 9A
155 9B
156 9C
157 9D
158 9E
159 9F
160 A0
161 A1
162 A2
163 A3
164 A4
165 A5
166 A6
167 A7
168 A8
169 A9
170 AA
171 AB
172 AC
173 AD
174 AE
175 AF
176 B0
177 B1
178 B2
179 B3
180 B4
181 B5
182 B6
183 B7
184 B8
185 B9
186 BA
187 BB
188 BC
189 BD
190 BE
191 BF
192 C0
193 C1
194 C2
195 C3
196 C4
197 C5
198 C6
199 C7
200 C8
201 C9
202 CA
203 CB
204 CC
205 CD
206 CE
207 CF
208 D0
209 D1
210 D2
211 D3
212 D4
213 D5
214 D6
215 D7
216 D8
217 D9
218 DA
219 DB
220 DC
221 DD
222 DE
223 DF
224 E0
225 E1
226 E2
227 E3
228 E4
229 E5
230 E6
231 E7
232 E8
233 E9
234 EA
235 EB
236 EC
237 ED
238 EE
239 EF
240 F0
241 F1
242 F2
243 F3
244 F4
245 F5
246 F6
247 F7
248 F8
249 F9
250 FA
251 FB
252 FC
253 FD
254 FE
255 FF

ie8不兼容rgba的解决的更多相关文章

  1. 真~让IE8支持background: rbga; ，IE8下兼容rgba颜色的半透明背景

    IE8下兼容rgba颜色的半透明背景 这样的标题在百度和google搜索下很多篇文章,讲解IE8下兼容rgba的. 这些文章全部都是使用IE下的filter来使元素透明,但是这个里面会有bug. 它们 ...

  2. IE8下兼容rgba颜色的半透明背景

    在工作中做一个图片半透明遮罩时发现在IE8下不兼容 一查再知道IE8不支持rgba颜色,再搜搜兼容性方法,没想到这么快就解决了. 先说说rgba的含义: r代表red,g代表green,b代表blue ...

  3. 解决IE8下不兼容rgba()的解决办法

    rgba()是css3的新属性,所以IE8及以下浏览器不兼容,这怎么办呢?终于我找到了解决办法. 解决办法 我们先来解释以下rgba rgba: rgba的含义,r代表red,g代表green,b代表 ...

  4. 完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法

    完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法   HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面布局,加上CSS3的效果渲染,快速建立丰富灵活的web页 ...

  5. IE8下实现兼容rgba

    昨天遇到一个问题,要实现一个背景透明的效果,用CSS3用rgba()就能实现,即 background: rgba(0,0,0,.5); 但是要兼容到IE8,就发现没有透明效果,因为IE8不支持rgb ...

  6. HTML5 Shiv完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法

    这篇文章主要介绍了HTML5 Shiv完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法,需要的朋友可以参考下 HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面 ...

  7. ie8的兼容

    1.IE8以下不支持getElementsByClassName方法//解决IE8之类不支持getElementsByClassNameif (!document.getElementsByClass ...

  8. DIV+CSS IE6/IE7/IE8/FF兼容问题汇总

    1.IE8下兼容问题,这个最好处理,转化成ie7兼容就可以.在头部加如下一段代码,然后只要在IE7下兼容了,IE8下面也就兼容了 <meta http-equiv="x-ua-comp ...

  9. background-size在IE8不兼容问题

    background-size在IE8及以下浏览器不兼容:要解决的话要用滤镜: filter: progid: DXImageTransform.Microsoft.AlphaImageLoader( ...

随机推荐

  1. Yii2的深入学习--继承关系

    想要了解 Yii2 的话,一定要对 Yii2 中相关类的继承关系有所了解.由于暂时读的代码有限,下面的图中只列出了部分继承关系,之后回跟着源码阅读的越来越多而增加 由上图可以看到 Yii2 中大多数类 ...

  2. Web 前端开发精华文章推荐（HTML5、CSS3、jQuery）【系列二十二】

    <Web 前端开发精华文章推荐>2014年第一期(总第二十二期)和大家见面了.梦想天空博客关注 前端开发 技术,分享各类能够提升网站用户体验的优秀 jQuery 插件,展示前沿的 HTML ...

  3. Android Fragment完全解析

    转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/8881711 我们都知道,Android上的界面展示都是通过Activity实现的, ...

  4. BitCoinJ之Hello World示例程序

    简介 比特币(BitCoin)是一种基于区块链(BlockChain)技术的数字化货币. 本文介绍了使用基于Java语言的BitCoinJ API实现一个简单的收取和支付比特币的示例程序. 开发环境 ...

  5. 安装thrift

    要求 thrift至少需要支持三种语言: Java PHP Go 预安装 基本教程: http://thrift.apache.org/docs/install/centos 使用最新的thrift, ...

  6. HT for Web嵌入QtWebKit的客户端解决方案

    HTML5已经足够强大,但很多应用还是需要独立桌面客户端的解决方案,毕竟能操作本地文件等功能还是很多工具类软件短期内无法完全采用云方案替代. 最近Adobe发布的http://brackets.io也 ...

  7. SQL Server获取下一个编码字符实现继续重构与增强

        我在SQL Server获取下一个编码字符实现的博文中,虽然实现了这个问题,但是感觉维护起来比较麻烦,例如如果调整编码字符串的固定长度,就需要变更三个函数,这样的为何成本确实比较大.面向对象编 ...

  8. JS虚拟键盘

    由于是触摸屏,所以需要一款JS虚拟键盘.上网找了一个好用的VirtualKeyboard,作了修改. 修改该插件参考的博客文章:http://www.cnblogs.com/xinggong/arch ...

  9. Javascript权威指南

    一.数字写法 3.14 2345.789 .333333333333333333 6.02e23 // 6.02 × 10 23 1.4738223E-32 // 1.4738223 × 10 −32 ...

  10. Monotype推出基于HTML5的Web字体平台

    著名字体公司Monotype近日宣布推出基于HTML5的Web字体平台,设计者可以访问近10万字体的目录. Monotype推出基于HTML5的Web字体平台 Monotype推出基于HTML5的We ...