IE和FireFox下透明度的设置方法

最新推荐文章于 2022-11-08 15:46:17 发布
转载 最新推荐文章于 2022-11-08 15:46:17 发布 · 830 阅读 · 0
文章标签：

#html #Firefox

本文介绍了在FireFox和IE浏览器中如何设置元素的透明度。FireFox使用CSS属性opacity设置，取值范围为0.0到1.0；而IE则通过filter属性alpha设置，取值范围为0到100。提供了在两种浏览器下的示例代码。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

FireFox下透明度设置的方法是：opacity=opacityValue;

opacityValue的取值范围是【0.0~1.0】即0到1的小数

IE下透明度设置的方法是：filter:alpha(opacity=opacityValue);

opacityValue的取值范围是【0~100】即0到100的整数

以下是firefox下的透明度设置例子

[html] view plain copy
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  2. <html>  
  3. <head>  
  4. <title>ffopacity.html</title>  
  5. <meta http-equiv="content-type" content="text/html; charset=UTF-8">  
  6. <style type="text/css" media="all">  
  7. #p1{  
  8. opacity:0.2;  
  9. }  
  10. #p2{  
  11. opacity:0.4;  
  12. }  
  13. #p3{  
  14. opacity:0.6;  
  15. }  
  16. #p4{  
  17. opacity:0.8;  
  18. }  
  19. #p5{  
  20. opacity:1;  
  21. }  
  22. p{  
  23. width:200px;  
  24. height:100px;  
  25. background-color:green;  
  26. }  
  27. </style>  
  28. </head>  
  29. <body>  
  30. <p id="p1">opacity:0.2;不透明度为20%</p>  
  31. <p id="p2">opacity:0.4;不透明度为40%</p>  
  32. <p id="p3">opacity:0.6;不透明度为60%</p>  
  33. <p id="p4">opacity:0.8;不透明度为80%</p>  
  34. <p id="p5">opacity:1;不透明度为100%</p>  
  35. <br/><br/>  
  36. <blockquote>IE不支持此属性,请使用Firefox或者Opera浏览.</blockquote>  
  37. </body>  
  38. </html>  

以下是IE下的透明度设置例子
[html] view plain copy
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  2. <html>  
  3. <head>  
  4. <title>ieopacity.html</title>  
  5. <meta http-equiv="content-type" content="text/html; charset=UTF-8">  
  6. <style type="text/css" media="all">  
  7. #p1{  
  8. filter:alpha(opacity=20);  
  9. }  
  10. #p2{  
  11. filter:alpha(opacity=40);  
  12. }  
  13. #p3{  
  14. filter:alpha(opacity=60);  
  15. }  
  16. #p4{  
  17. filter:alpha(opacity=80);  
  18. }  
  19. #p5{  
  20. filter:alpha(opacity=100);  
  21. }  
  22. p{  
  23. width:300px;  
  24. height:100px;  
  25. background-color:green;  
  26. }  
  27. </style>  
  28. </head>  
  29. <body>  
  30. <p id="p1">filter:alpha(opacity=20);不透明度为20</p>  
  31. <p id="p2">filter:alpha(opacity=40);不透明度为40</p>  
  32. <p id="p3">filter:alpha(opacity=60);不透明度为60</p>  
  33. <p id="p4">filter:alpha(opacity=80);不透明度为80</p>  
  34. <p id="p5">filter:alpha(opacity=100);不透明度为100</p>  
  35. <br/><br/>  
  36. <blockquote>IE下的属性</blockquote>  
  37. </body>  
  38. </html> 
透明度设置(IE浏览器透明度的解决)
weixin_43370067的博客
04-22 3636
1、背景透明 内容不透明 css background-color:rgba(); alpha 透明度 0-1 2. 背景透明+ 内容透明 opacity:0-1 透明度 IE8及其以下不支持rgba(),opacity (因为这两个属性是新增的属性 出生在IE8出生之后) IE专属的透明度设置 filter:Alpha(opacity=30); ?透明度值 是0-100的值 30 === ...
CSS 半透明度设置归纳总结[Firefox,IE,Chrome,Safari]
09-25
本文将详细地介绍如何在Firefox、IE、Chrome以及Safari等主流浏览器中设置半透明效果。 首先，需要明确的是CSS中的半透明度属性通常通过`opacity`属性来实现。`opacity`属性用于设置元素的透明度，其取值范围从0...
透明浏览器，可以设置透明度的浏览器
05-23
基于ie内核的浏览器，可以设置透明度（0-100），0代表完全透明，数值可以随便设置（最小值为15），按ESC键浏览器立即退出，不想让别人看到你在上网，可以用此浏览器。
ie怎么设置透明度
weixin_30872499的博客
07-10 248
对于主流浏览器我们可以用opacity：0.8来设置透明度。 opacity是css3属性，ie不支持怎么办呢？我们可以用下面这种方法来解决： .div{ fliter:alpha(opacity=80); } 转载于:https://www.cnblogs.com/xsffliu/p/7146750.html...
在Firefox中设置元素透明度：-moz-opacity
C'est la vie de Maxime
02-03 3660
摘要 在基于Gecko引擎的浏览中（Firefox、Mozilla）, -moz-opacity 用于定义一个元素的透明度。 语法 -moz-opacity: number | inherit ; 赋值 0 (或更少)     元素完全透明 (invisible) 0     元素透明 (背景可见) 1 (或更多)     元素完全不透明 (solid) 范例 hb
CSS实现 Firefox 和 IE 都支持的半透明效果
09-25
然而，由于不同的浏览器对CSS的支持程度不同，尤其是早期版本的Firefox和Internet Explorer（IE），它们处理透明度的方式有所不同。这篇内容将详细介绍如何使用CSS来实现既能在Firefox上正常工作，也能在IE上呈现的...
javascript支持IE和firefox(FF)的渐变透明效果
10-30
Firefox和其他现代浏览器使用CSS的`opacity`属性来设置元素的透明度。`opacity`的取值范围是0到1，0表示完全透明，1表示完全不透明。通过JavaScript的`style.opacity`，我们可以动态改变这个值来实现渐变。 3. **...
css中filter:alpha透明度使用小结兼容IE、火狐
12-13
本文将深入探讨如何使用`filter:alpha`在IE和火狐浏览器中实现透明度控制，并介绍相关的CSS透明度属性。 首先，`filter:alpha`是Internet Explorer浏览器特有的滤镜（filter）属性，用于设置元素的透明度。其基本...
ie8及更早版本透明度设置_创造更多的管理透明度
danpu1174的博客
05-08 166
ie8及更早版本透明度设置 在敏捷和精益社区中，我们经常谈论透明度。 此图像是我们在《 从混沌到分布式敏捷团队》中使用的透明性原则。 当各个团队在连续性的中间部分之间建立透明性时，我看到了最大的产品和计划成功。 这就是整个产品的透明度。 我看到，如果经理了解得越少 ，团队工作就越好， 那么许多组织就会取得更好的成功。 而且，当经理与团队之间的透明度太低时，工作将变得更加困难或失败...
多个浏览器透明度设置
12-11
各个浏览器透明度设置 filter:alpha(opacity=80); -moz-opacity:0.8; opacity: 0.8;
如何使flash在ie,firefox,safari网页中都显示透明的方法
03-27
如何使flash在ie,firefox,safari网页中都显示透明的方法
CSS透明度设置支持IE，Chrome，Firefox浏览器
adgjlxxx的专栏
07-06 2997
CSS文件中设置如下即可 filter:alpha(opacity=60); //支持IE opacity:0.6; //支持Chrome，Firefox
兼容IE、Firefox的背景半透明内容不透明设置
ajb11683的博客
12-31 127
　　首先要说明的是背景是内容的祖先元素。如果是兄弟节点那就没有必要记录这篇文章了。 　　记录一下，知其然也知其所以然。 IE8-特点： 　　1.不支持"opcity:0.5;"这种写法，只支持"filter:alpha(opacity=50)"。 　　2.如果背景元素拥有css属性设置了z-index的值（除默认值auto外),则内容会随着背景元素一起半透明 　　3.如果背景元...
【桌面运维】Chrome浏览器显示半透明的问题怎样解决
Q159393的博客
11-08 5124
打开谷歌浏览器发现搜索框上的logo变成半透明了怎么办？然后还原默认设置，即可。如图所所示：先打开设置。
[记录]firefox与IE透明度(opacity)设置区别
IT
11-12 155
1.IE6设置透明度     css设置 filter:alpha(opacity=50);     javascript设置 ieSpanJs.style.filter="alpha(opacity=50)";   2.firefox3.5设置透明度    firefox3.5支持css3，已经不对原来的透明度样式(-moz-opacity)提供支持（网上查的），在本人的firef...
适用ie/firefox的透明css
我的笔记
04-11 509
img{    /*不用透明    filter: Alpha(opacity=50);       -moz-opacity:.5;       opacity:0.5;    */}
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值