CSS中怎么实现Firefox与IE透明度
本篇内容介绍了“CSS中怎么实现Firefox与IE透明度”的有关知识，在实际案例的操作过程中，不少人都会遇到这样的困境，接下来就让小编带领大家学习一下如何处理这些情况吧！希望大家仔细阅读，能够学有所成！
CSS中实现Firefox与IE透明度(opacity)的不同方法
Dreamweaver提供的透明度样式只能支持IE,想要在Firefox下实现，需要自己手写。如下：
1.IE6设置透明度
CSS设置
filter:alpha(opacity=50);
javascript设置
IESpanJs.style.filter=“alpha(opacity=50)”;
2.Firefox3.5设置透明度
Firefox3.5支持CSS3，已经不对原来的透明度样式(-moz-opacity)提供支持（网上查的），在本人的Firefox3.5.5上测试后，发现确实如此，现在的透明度设置为：
CSS设置
opacity:0.5;
javascript设置
FirefoxSpanJs.style.mozOpacity=“0.5″;
3.Firefox3.5以前版本设置透明度
CSS设置
-moz-opacity:0.5;
javascript设置
FirefoxSpanJs.style.mozOpacity=“0.5″;
4.demo代码
<HTML> <HEAD> <style type=“text/CSS”> .IECSS { display:-moz-inline-box; display:inline-block; width:100; height:100; background-color:red; filter:alpha(opacity=50); } .Firefox35CSS { display:-moz-inline-box; display:inline-block; width:100; height:100; background-color:blue; opacity:0.5; } .FirefoxCSS { display:-moz-inline-box; display:inline-block; width:100; height:100; background-color:yellow; -moz-opacity:0.5; } </style> <script> window.onload = function() { //设置IE var IESpanJs = document.getElementById(“IESpanJs”); IESpanJs.style.display = “inline-block”; //IE支持 IESpanJs.style.width = 100; IESpanJs.style.height = 100; IESpanJs.style.backgroundColor = “red”; IESpanJs.style.filter=“alpha(opacity=50)”; //设置Firefox3.5.* var Firefox35SpanJs = document.getElementById(“Firefox35SpanJs”); try { Firefox35SpanJs.style.display = “-moz-inline-box”; //Firefox支持 } catch (e) { Firefox35SpanJs.style.display = “inline-block”; //支持IE } Firefox35SpanJs.style.width = 100; Firefox35SpanJs.style.height = 100; Firefox35SpanJs.style.backgroundColor = “blue”; Firefox35SpanJs.style.opacity=“0.5″; //设置Firefox var FirefoxSpanJs = document.getElementById(“FirefoxSpanJs”); try { FirefoxSpanJs.style.display = “-moz-inline-box”; //Firefox支持 } catch (e) { FirefoxSpanJs.style.display = “inline-block”; //支持IE } FirefoxSpanJs.style.width = 100; FirefoxSpanJs.style.height = 100; FirefoxSpanJs.style.backgroundColor = “yellow”; FirefoxSpanJs.style.mozOpacity=“0.5″; } </script> </HEAD> <BODY> <span id=“IESpanCSS” class=“IECSS”>IE_CSS</span> <span id=“Firefox35SpanCSS” class=“Firefox35CSS”>Firefox3.5_CSS</span> <span id=“FirefoxSpanCSS” class=“FirefoxCSS”>Firefox_CSS</span> <br> <br> <span id=“IESpanJs”>IE_Js</span> <span id=“Firefox35SpanJs”>Firefox3.5_Js</span> <span id=“FirefoxSpanJs”>Firefox_Js</span> </BODY> </HTML>“CSS中怎么实现Firefox与IE透明度”的内容就介绍到这里了，感谢大家的阅读。如果想了解更多行业相关的知识可以关注编程网网站，小编将为大家输出更多高质量的实用文章！
免责声明：
① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的，并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据，供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。
② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
