IE, FireFox, Opera 浏览器支持CSS实现Alpha半透明的方法
生活随笔
收集整理的這篇文章主要介紹了
IE, FireFox, Opera 浏览器支持CSS实现Alpha半透明的方法
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
這個(gè)世界變化很快,IE8也快出來了,它將不在支持以前{filter:alpha(opacity=50);}的私有屬性,轉(zhuǎn)而支持更規(guī)范的私有屬性-ms-filter: “progid:DXImageTransform.Microsoft.Alpha(Opacity=50)”;加之Firefox2.0和Opera9.0以前版本很少見到,所以所有的主流瀏覽器都已經(jīng)支持純CSS而不用png圖片來實(shí)現(xiàn)半透明效果,代碼是:
<div id="out"><div id="in">不透明<div><div id="alpha">半透明<div> <div> <style type="text/css"> #out{padding:20px 0;height:100px;width:200px;position:relative; } #in{background:#fff;margin:0 10px; } #alpha{position: absolute;top:0;left: 0;width: 100%;height:100%;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; /*IE8*/filter:alpha(opacity=30); /*IE5、IE5.5、IE6、IE7*/opacity: .3; /*Opera9.0+、Firefox1.5+、Safari、Chrome*/z-index: -1; /*讓其位于in的下面*/background:#fff; } </style>http://dancewithnet.com/2006/05/18/css-alpha-transparent/
總結(jié)
以上是生活随笔為你收集整理的IE, FireFox, Opera 浏览器支持CSS实现Alpha半透明的方法的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: STM32F4读写内部FLASH【使用库
- 下一篇: MVC 使用自定义HtmlHelper截