IE8下兼容rgba顏色的半透明背景


在工作中做一個圖片半透明遮罩時發現在IE8下不兼容

一查再知道IE8不支持rgba顏色,再搜搜兼容性方法,沒想到這么快就解決了。

先說說rgba的含義:

r代表red,g代表green,b代表blue,a代表透明度。紅綠藍是三原色,所有顏色都可以由這三種顏色拼合而成。比如rgba(0,0,0,.5)就是透明度為0.5的黑色。現代瀏覽器是支持rgba的,但是在IE8等古董級瀏覽器中是不支持rgba的,IE8只能勉強支持rgb()函數(即去掉了透明度,只能表示顏色)。

網上的解決方法是:

background: rgba(0,0,0,.5); /*支持rgba的瀏覽器*/

filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f000000,endColorstr=#7f000000); /*IE8支持*/

第二句話的意思就是當上一行的透明度不起作用的時候執行。這句話的意思本來是用來做漸變的,但是這個地方不需要漸變。所以兩個顏色都設置成了相同的顏色。

解釋下#7f000000,第一部分是#號后面的7f。是rgba透明度0.5的IEfilter值。從0.1到0.9每個數字對應一個IEfilter值。對應關系如下:

第二部分是19后面的六位。這個是六進制的顏色值。要跟rgb函數中的取值相同。比如rgb(0,0,0,)對應#000;都是黑色。

到這里,rgba的用法就可以兼容IE8了。

但是經過實踐發現這種方法只能用在背景色上,前景色或其他則無能為力了


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM