兼容各浏览器：CSS定义PNG透明效果

 虽然有CSS有很多方法能实现PNG图片透明效果，但在各浏览器中的兼容效果却不好，小编找到了一个能兼容各浏览器用CSS定义PNG透明效果的方法，方法如下：

<style>
.mycls{
width: 48px;
height: 48px;
background: url(20090318230119136.png) no-repeat left top;
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale,src="20090318230119136.png");
}
</style>
<body bgcolor="#CCCCCC">
<div class="mycls"></div>
</body>
用以上方法就能用CSS实现PNG图片透明效果并兼容各种浏览器，快点试试吧。
本文属网络教学基地原创，转载请注明：http://www.studynb1.com/css/156.html

时间： 2024-10-24 07:28:14

兼容各浏览器：CSS定义PNG透明效果的相关文章

CSS定义通用透明效果

css|透明  在netvibes的CSS看到一个片断.transparent{  filter:alpha(opacity=12);  -moz-opacity:0.12;  opacity:0.12;  background-color:#000;}filter:alpha(opacity=12); 支持IE-moz-opacity:0.12; 支持FFopacity:0.12; 支持未知 2006年1月22日 Netvibes.com CSS 点击下载20K

CSS定义通用透明效果_CSS/HTML

复制代码 代码如下: .transparent{filter:alpha(opacity=12);-moz-opacity:0.12;opacity:0.12;background-color:#000;} filter:alpha(opacity=12); 支持IE -moz-opacity:0.12; 支持FF opacity:0.12; 支持未知 

CSS网页制作技巧:兼容主流浏览器的背景颜色透明

文章简介:CSS网页制作技巧:兼容主流浏览器的背景颜色透明. 以前都是用jquery来写背景透明,方法简单,但是有缺点,脚本没加载完时,背景颜色是不透明的.如果换成在css里写好的话,效果就很好了..transparent_class { filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5; } 上面的几个属性分别是: opacity: 0.5; 这是最重要的,因为它是CSS标准.该属性支持f

兼容ie和firefox css alpha实现透明效果

为了实现一些特殊效果,需要将页面元素变透明,本文介绍的就是用 CSS 实现 Firefox 和 IE 都支持的 Alpha 透明效果.  代码如下 复制代码 filter:alpha(opacity=50);       /* IE */ -moz-opacity:0.5;              /* Moz + FF */ opacity: 0.5;           /* 支持CSS3的浏览器(FF 1.5也支持)*/ IE使用私有属性filter:alpha(opacity),Moz

IE7,IE8浏览器CSS实现正圆角效果代码

一.关于IE7, IE8不支持CSS3 border-radius CSS3 border-radius可以轻易实现圆还有圆角效果,然而,需要IE9+浏览器才行.移动端自然不成问题,但是众多(尤其面向C侧)PC页面是至少需要兼容IE8的,那有没有什么办法可以让IE7, IE8也支持圆角呢? 很久很久以前介绍过一个名为PIE的东西可以实现IE7,IE8的圆角,是10年7月份写的一篇"PIE使IE支持CSS3圆角盒阴影与渐变渲染"(本文还有其他很多圆角方法介绍). 其原理是利用的IE私有的

兼容IE6浏览器CSS背景半透明实例

这里用到了IE的filter的滤镜效果,background:rgba是CSS3属性,大家都知道. 最后一句是针对IE9的.用了结构性伪类 E:root : {attribute} , 伪类:root 仅支持CSS3的浏览器 ,所以这段CSS是兼容所有浏览器的. 核心代码  代码如下 复制代码 #header{ filter:progid:DXImageTransform.Microsoft.gradient(enabled='true', startColorstr='#E518515F',

CSS实现的透明效果

/* 值越大,越不透明*/ img {     opacity: .75; /* Standard: FF gt 1.5, Opera, Safari */     filter: alpha(opacity=75); /* IE lt 8 */     -ms-filter: "alpha(opacity=75)"; /* IE 8 */     -khtml-opacity: .75; /* Safari 1.x */     -moz-opacity: .75; /* FF lt

css控制图片透明效果代码

测试效果1 测试效果-改变角度 分别修改.perspective-r的border-top和.perspective-b的border-left的width值,值越大角度越大:同时修改.perspective-r的高度值和.perspective-b的宽度值. 测试效果-改变距离 分别修改.perspective-r的border-left和.perspective-b的border-top的width值,值越大距离越大:增加.perspective-outer的宽度和高度值,并修改.persp

在火狐浏览器中使用透明效果的代码

火狐浏览器|透明 火狐浏览器中如何使用透明效果呢? 设置为半通明的代码如下: filter: Alpha(Opacity=0);-moz-opacity:0.5;opacity: 0;