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

在调试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. ASP.NET将Session保存到数据库中

    因为ASP.NET中Session的存取机制与ASP相同,都是保存在进行中, 一旦进程崩溃,所有Session信息将会丢失,所以我采取了将Session信息保存到SQL Server中,尽管还有其它的 ...

  2. Anti-If: The missing patterns--转

    原文地址:http://code.joejag.com/2016/anti-if-the-missing-patterns.html Around 10 years ago I encountered ...

  3. Android横竖屏切换及其对应布局加载问题

    第一,横竖屏切换连带横竖屏布局问题: 如果要让软件在横竖屏之间切换,由于横竖屏的高宽会发生转换,有可能会要求不同的布局. 可以通过以下两种方法来切换布局: 1)在res目录下建立layout-land ...

  4. HT for Web 3D游戏设计设计--汉诺塔(Towers of Hanoi)

    在这里我们将构造一个基于HT for Web的HTML5+JavaScript来实现汉诺塔游戏. 汉诺塔的游戏规则及递归算法分析请参考http://en.wikipedia.org/wiki/Towe ...

  5. qml基础学习 Canvas画笔

    一.画布元素 自qt4.7发布qml以来,qml也在一直不断的完善中,在qt4时代使用qml时如果需要异形图,那我们只能让设计师来切图,这样的感觉是很不爽的,总感觉开发没有那么犀利.但是到了qt5这一 ...

  6. DB表的关系及EF中Fluent API的使用

    现在使用多数的数据库是关系型数据库,那么表与表之间的关系就会显得尤其重要,对于数据的CRUD处理和以后数据的分析有很大的好处.下面是对于数据库中对表关系的理解以及在EF中使用Fluent API来创建 ...

  7. 关于Html与css的一些解释

    一.简单介绍 1.html,是hyper text markup language的缩写,中文为“超文本标记语言”. 2.html不是编程语言而是一种标记语言. 二.标签与元素 1.html标签:如& ...

  8. 【转载】Lucene.Net入门教程及示例

    本人看到这篇非常不错的Lucene.Net入门基础教程,就转载分享一下给大家来学习,希望大家在工作实践中可以用到. 一.简单的例子 //索引Private void Index(){    Index ...

  9. .Net语言 APP开发平台——Smobiler学习日志:如何在webview中加载网页

    最前面的话:Smobiler是一个在VS环境中使用.Net语言来开发APP的开发平台 一.目标样式 我们要实现上图中的效果,需要如下的操作: 1.从工具栏上的“Smobiler Components” ...

  10. JavaBean 的小知识点

    /** * @author http://roucheng.cnblogs.com * @version 2016-05-08 */ public class Person { private Str ...