下载文档原格式
FF和IE7已经直接支持透明的png图了,下面这个主要是解决IE6下透明PNG图片有灰底的================================================ =============================此效果简单，。
相当不错推荐style="FILTER:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/fl.png')"语法：filter : progid:DXImageTransform.Microsoft.AlphaImageLoader( enabled=bEnabled , sizingMethod=sSize , src=sURL )enabled : 可选项。
布尔值(Boolean)。
设置或检索滤镜是否激活。
true | false true : 默认值。
滤镜激活。
false : 滤镜被禁止。
sizingMethod : 可选项。
字符串(String)。
设置或检索滤镜作用的对象的图片在对象容器边界内的显示方式。
crop : 剪切图片以适应对象尺寸。
image : 默认值。
增大或减小对象的尺寸边界以适应图片的尺寸。
scale : 缩放图片以适应对象的尺寸边界。
src : 必选项。
字符串(String)。
使用绝对或相对url 地址指定背景图像。
假如忽略此参数，滤镜将不会作用。
特性：Enabled : 可读写。
布尔值(Boolean)。
参阅enabled 属性。
sizingMethod : 可读写。
字符串(String)。
参阅sizingMethod 属性。
src : 可读写。
字符串(String)。
参阅src 属性。
说明：在对象容器边界内，在对象的背景和内容之间显示一张图片。
并提供对此图片的剪切和改变尺寸的操作。
如果载入的是PNG(Portable Network Graphics)格式，则0%-100%的透明度也被提供。
如何使用Photoshop进行图片透明化处理步骤一：导入图片1. 打开Photoshop软件。
2. 点击菜单栏的“文件”选项，选择“打开”，找到你想要处理的图片并点击“打开”。
步骤二：准备工作1. 在Photoshop的右侧工具栏中选择“框选工具”。
2. 使用框选工具在你想要进行透明化处理的区域周围画出一个选框。
3. 菜单栏中选择“图像”选项，然后选择“裁剪”。
步骤三：背景透明化处理1. 在右侧工具栏中选择“魔术橡皮擦工具”。
2. 调整魔术橡皮擦工具的大小，选择一个合适的橡皮擦大小。
3. 使用魔术橡皮擦工具擦除图片上的背景区域。
当擦除时，你会发现魔术橡皮擦慢慢将背景变为透明。
步骤四：细化处理1. 如果图片上有一些细节、边缘或其他不需要的区域没有完全透明化，你可以使用“橡皮擦工具”进行精确处理。
点击右侧工具栏上的橡皮擦工具，调整大小后，小心擦除这些细节部分。
2. 如果图片上有不需要透明化的区域被错误地擦除了，你可以使用“画笔工具”重新涂抹上不透明的颜色。
点击右侧工具栏上的画笔工具，调整大小和颜色，然后用画笔重新绘制这些区域。
步骤五：保存图片1. 点击菜单栏的“文件”选项，选择“另存为”。
2. 选择一个保存图片的路径和名称，然后选择JPEG或PNG等适合你需要透明背景的格式。
3. 点击“保存”按钮，完成透明化处理并保存图片。
总结：使用Photoshop进行图片透明化处理并不复杂。
通过合理使用魔术橡皮擦工具和其他工具，你可以轻松地将图片背景变为透明。
记得在处理过程中保留细节并小心细致地处理，以获得更好的结果。
最后，保存处理完的图片并进行必要的导出即可完成整个透明化处理过程。
PNG透明窗体全攻略（控件不透明）收藏源代码下载地址：/source/1604248编译环境：vc6+winxp sp3测试通过这两天在研究透明窗体，总算略有小成。
网上大部分文章都是介绍到把窗体弄透明就没有下文。
其实窗体透明并不难，难就难在透明的窗体上还要放控件。
今天我就把窗体透明一直到控件不透明怎么制作一块给写了吧。
先截张图诱惑下你们，如果你没兴趣就没必要再看下文了，有兴趣的话就继续往下看吧^_^！看好了，这是XP系统，未装.net。
我的Photoshop学的不太好，把玻璃片弄的太透了些，如果你们有好的美术，再加上这种技术，肯定会如鱼得水。
下面就来详细说说它的制作过程吧：第一步：在VC6中使用GDI+：你得从网上弄个GDI+ for XP的库，大约500K。
如果找不到的话，找我QQ要吧，我会把这个窗口的源程序一起发给你的。
把它解压后，将所有文件还包括子目录中的文件复制到你的项目目录。
在stdafx.h中加入以下代码：#include "gdiplus.h" ////请修改为你的头文件路径using namespace Gdiplus;#pragma comment(lib, "gdiplus.lib") ////请修改为你的.lib文件路径我的项目名为Test，所以在TestApp中加入全局变量ULONG_PTR gdiplusToken;在BOOL CTestApp::InitInstance()中加入这两行：GdiplusStartupInput gdiplusStartupInput;GdiplusStartup(&gdiplusToken, &gdiplusStartupInput, NULL);记住在线程退出后要御掉GDI+，它很占资源的，在int CTestApp::ExitInstance() 中加入这行：GdiplusShutdown(gdiplusToken);一切准备工作就绪，开始制作窗口了。
PNG图像格式介绍：PNG是20世纪90年代中期开始开发的图像文件存储格式，其目的是企图替代GIF和TIFF 文件格式，同时增加一些GIF文件格式所不具备的特性。
流式网络图形格式(Portable Network Graphic Format，PNG)名称来源于非官方的“PNG’s Not GIF”，是一种位图文件(bitmap file)存储格式，读成“ping”。
PNG用来存储灰度图像时，灰度图像的深度可多到16位，存储彩色图像时，彩色图像的深度可多到48位，并且还可存储多到16位的α通道数据。
IE6下PNG背景透明的显示问题PNG格式比起GIF来表现色彩更丰富，特别是表现渐变以及背景透明的渐变要比GIF格式出色很多，目前，最新的浏览器基本上都支持PNG格式。
但是IE6不支持PNG背景透明，会显示一个灰色的框。
IE6下PNG背景透明的解决办法.pngImg { background:url(image.png); _background:url(image.gif);}注意上文的_号，目前IE7,8以及Firefox浏览器等都不支持此CSS语法，只有IE6识别。
因此，其他浏览器会调用PNG，而IE6刚调用GIF。
二.滤镜filter解决IE6下背景灰background:url(a.png) repeat-x 0 0; _background:none;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="a.png" ,sizingM ethod="crop");上面的原理是其他调用PNG，IE6,则先设背景没有，然后调用滤镜使之显示PNG图片。
缺陷：IE6下背景无法平铺，这个问题很严重。
同时在性能上也有小问题，页面中次数不是很多的时候该办法还是可行的。
AlphaImageLoader滤镜会导致该区域的链接和按钮无效，解决的办法是为链接或按钮添加：position: relative;这样条代码，使其相对浮动。
使用Photoshop改变照片的透明度和混合模式改变照片的透明度和混合模式是许多人经常使用Photoshop的功能。
无论是为了艺术创作，设计作品，还是编辑照片，这些功能都可以让图片的效果更加出色和独特。
在本文中，我们将讨论如何在Photoshop中使用这些功能来提高您的照片的效果和质量。
改变照片的透明度改变照片的透明度是一种简单而有效的方法，可以将两个或多个图像混合在一起，创造出惊人的特效。
在Photoshop中，更改图层的透明度是实现这一目标的最常用方法之一。
要更改图层的透明度，请选择要更改透明度的图层。
然后找到“图层面板”中的“不透明度”滑块，并将其向左滑动以降低不透明度。
这将使图层变得透明，并允许下面的图层显示。
如果你希望图层更少透明度，只需将滑块向左滑动即可。
另一种改变透明度的方法是通过“图层样式”窗口。
选择图层之后，单击“图层样式”按钮，然后选择“颜色叠加”。
在“颜色叠加”选项卡中，您将看到一个滑块，可以用来更改图层的透明度。
移动滑块以达到所需的透明效果，然后单击“确定”按钮。
如果恢复原始状态，只需将“不透明度”滑块或“颜色叠加”选项卡中的滑块向右移动，即可恢复至原始不透明度。
混合模式混合模式是一种用于在不影响原始颜色的情况下将两个或多个图像组合在一起的方法。
混合模式的工作原理是改变图像的像素之间的颜色关系，从而创建新的视觉效果。
Photoshop中有多种混合模式，如“叠加”，“滤色器”和“差异”等。
要更改混合模式，请选择要从中选择的图层。
然后单击“图层面板”中的“混合模式”下拉列表，并选择所需的选项。
您可以在选择其它图层的情况下预览此更改。
混合模式可以用于几乎任何类型的图像，包括照片，插画和图形设计元素。
在使用混合模式之前，最好先了解它们的效果，并以小的图像或区域开始。
随着您的经验和技能的增长，您可以开始在更复杂的图形中使用更多的混合模式。
总结使用Photoshop来更改照片的透明度和混合模式是扩展您照片编辑技能的一种简单方法。
png 透明PNG透明PNG（Portable Network Graphics）是一种用于存储图像的文件格式，它广泛用于互联网上的图像传输。
与JPEG等其他图像格式相比，PNG具有许多独特的特点，其中最显著的之一就是它的透明性。
PNG的透明性使得它成为在网页设计和图形设计中非常受欢迎的文件格式。
透明的图像可以与网页背景无缝融合，具有更好的视觉效果。
在本文中，我们将探讨PNG的透明性以及如何在设计中使用它。
首先，让我们了解一下PNG透明的工作原理。
在PNG中，透明通道以及alpha值用于控制图像的透明度。
每个像素可以具有从完全透明到完全不透明的不同透明度级别。
这使得我们能够创建半透明的图像效果，例如阴影、渐变和淡入淡出效果。
要创建一个透明的PNG图像，我们可以使用图像处理软件，例如Adobe Photoshop或GIMP。
这些软件允许我们选择图像的某个部分，然后将其设置为透明。
我们可以通过选择工具来进行选择，如矩形选择、椭圆形选择或套索工具。
一旦我们选择了一个区域，我们可以使用透明度工具将其设置为透明。
在PNG中，透明区域与不透明区域是以像素的形式分割的。
对于每个像素，都有一个与之相关的alpha通道值。
这个值控制了像素的不透明度，可以是0到255之间的任意值，其中0表示完全透明，255表示完全不透明。
当我们在设计中使用PNG图像时，透明性为我们提供了一些独特的特点。
首先，我们可以将PNG图像放置在任何背景上，而不会出现瑕疵或白色边框。
这使得我们能够创建更为出色的视觉效果，例如悬浮效果或图像叠加。
其次，透明性使得我们能够创建复杂的图层效果。
通过在不同的图层上使用透明PNG图像，我们可以创建出更加丰富多样的效果。
例如，在网页设计中，我们可以使用透明的PNG图像作为网页背景，并在其上叠加其他元素。
这样一来，我们可以创造出更加引人注目的页面设计。
另外，透明PNG图像还可以用于创建图形的渐变和过渡效果。
Photoshop中的透明度和混合模式技巧分享Photoshop是一款强大的图像处理软件，通过它我们可以实现各种令人惊叹的效果。
而在使用Photoshop时，透明度和混合模式是非常重要的工具，可以让我们更好地控制图层的效果和透明度。
本文将分享一些透明度和混合模式的技巧，希望能对大家有所帮助。
一、透明度技巧1. 降低图层的透明度：在图层面板中，可以通过调整图层的不透明度滑块来降低图层的透明度。
这样可以使图层的内容变得半透明，与其他图层混合在一起，创造出更加柔和的视觉效果。
2. 使用透明橡皮擦：在橡皮擦工具选项中，将不透明度设置为较低的数值，然后使用橡皮擦擦除图层上的部分内容。
这样可以创建出一种渐变的过渡效果，非常实用。
3. 透明度渐变：在工具栏中选择渐变工具，然后在选项栏中将模式设置为“渐变透明度”。
接下来，在图层上绘制渐变，可以创建出透明度逐渐变化的效果。
二、混合模式技巧1. 正片叠底（Multiply）：通过将图层的混合模式设置为正片叠底，可以将图层上的暗色调与下方的图层混合在一起。
这样可以营造出一种氛围更加沉重的效果，适用于创建夜景或暗调的场景。
2. 滤色（Screen）：将图层的混合模式设置为滤色，可以将图层的亮色调与下方的图层混合在一起。
这样可以增加图像的亮度和对比度，适用于创建阳光照射或明亮场景。
3. 叠加（Overlay）：通过将图层的混合模式设置为叠加，可以将图层上的高光与下方的图层混合在一起。
这样可以增加图像的细节和明暗效果，适用于加强图像的纹理和阴影。
三、透明度和混合模式的组合应用1. 创建透明文字：在一个文本图层上使用透明度技巧，将文字变得半透明。
然后通过混合模式的应用，将文字与下方的图层混合在一起，产生出一种透过文字看到底层图像的效果。
2. 制作海报底纹：借助于透明度和混合模式的技巧，可以制作出多样的海报底纹效果。
可以使用渐变透明度工具，在图层上绘制渐变透明度，然后将混合模式设置为叠加或滤色，使底纹更加丰富和有层次感。
png格式图⽚背景不透明问题解决⽅法⼀（CSS滤镜，某些时候不管⽤）：⽅法⼆：（引⽤js⼯具类，成功）var DD_belatedPNG={ns:"DD_belatedPNG",imgSize:{},delay:10,nodesFixed:0,createVmlNameSpace:function(){if(spaces&&!spaces[this.ns]){spaces.add(this.ns,"urn:schemas-microsoft-com:vml")}},createVmlStyleSheet:function(){varb,a;b=document.createElement("style");b.setAttribute("media","screen");document.documentElement.firstChild.insertBefore(b,document.documentElement.firstChild.firstChild);if(b.styleSheet){b=b.styleSheet;b.addRule(this.ns+"\\:*","{behavior:url(#default#VML)}");b.addRule(this.ns+"\\:shape","position:absolute;");b.addRule("img."+this.ns+"_sizeFinder","behavior:none; border:none; position:absolute; z-index:-1; top:-10000px;visibility:hidden;");this.screenStyleSheet=b;a=document.createElement("style");a.setAttribute("media","print");document.documentElement.firstChild.insertBefore(a,document.documentElement.firstChild {display: none !important;}");a.addRule("img."+this.ns+"_sizeFinder","{display: none !important;}")}},readPropertyChange:function(){varb,c,a;b=event.srcElement;if(!b.vmlInitiated){return}if(event.propertyName.search("background")!=-1||event.propertyName.search("border")!=-1){DD_belatedPNG.applyVML(b)}if(event.propertyName=="style.display"){c=(b.currentStyle.display=="none")?"none":"block";for(a in b.vml){if(b.vml.hasOwnProperty(a)){b.vml[a].shape.style.display=c}}}if(event.propertyName.search("filter")!=-1){DD_belatedPNG.vmlOpacity(b)}},vmlOpacity:function(b){if(b.currentStyle.filter.search("lpha")!=-1){vara=b.currentStyle.filter;a=parseInt(a.substring(stIndexOf("=")+1,stIndexOf(")")),10)/100;b.vml.color.shape.style.filter=b.currentStyle.filter;b.vml.image.fill.opacity=a}},handlePseudoHover:function(a) {setTimeout(function(){DD_belatedPNG.applyVML(a)},1)},fix:function(a){if(this.screenStyleSheet){var c,b;c=a.split(",");for(b=0;b<c.length;b++){this.screenStyleSheet.addRule(c[b],"behavior:expression(DD_belatedPNG.fixPng(this))")}}},applyVML:function(a){a.runtimeStyle.cssText="";this.vmlFill(a);this.vmlOffsets(a);this.vmlOpacity(a);if(a.isImg){this.copyImageBorders(a)}},attachHandlers:function(i){var d,c,g,e,b,f;d=this;c= {resize:"vmlOffsets",move:"vmlOffsets"};if(i.nodeName=="A"){e={mouseleave:"handlePseudoHover",mouseenter:"handlePseudoHover",focus:"handlePseudoHover",blur:"handlePseudoHover"};for(b in e){if(e.hasOwnProperty(b)){c[b]=e[b]}}}for(f in c){if(c.hasOwnProperty(f)){g=function(){d[c[f]](i)};i.attachEvent("on"+f,g)}}i.attachEvent("onpropertychange",this.readPropertyChange)},giveLayout:function(a){a.style.zoom=1;if(a.currentStyle.position=="static"){a.style.position="relative"}},copyImageBorders:function(b){var c,a;c={borderStyle:true,borderWidth:true,borderColor:true};for(a in c){if(c.hasOwnProperty(a)){b.vml.color.shape.style[a]=b.currentStyle[a]}}},vmlFill:function(e){if(!e.currentStyle){return}else{var d,f,g,b,a,c;d=e.currentStyle}for(b in e.vml){if(e.vml.hasOwnProperty(b)){e.vml[b].shape.style.zIndex=d.zIndex}}e.runtimeStyle.backgroundColor="";e.runtimeStyle.backgroundImage="";f=true;if(d.backgroundImage!="none"||e.isImg){if(!e.isImg){e.vmlBg=d.backgroundImage;e.vmlBg=e.vmlBg.substr(5,stIndexOf('")')-5)}else{e.vmlBg=e.src}g=this;if(!g.imgSize[e.vmlBg]){a=document.createElement("img");g.imgSize[e.vmlBg]=a;a.className=g.ns+"_sizeFinder";a.runtimeStyle.cssText="behavior:none; position:absolute; left:-10000px; top:-10000px; border:none; margin:0; padding:0;";c=function(){this.width=this.offsetWidth;this.height=this.offsetHeight;g.vmlOffsets(e)};a.attachEvent("onload",c);a.src=e.vmlBg;a.removeAttribute("width");a.removeAttribute("height");document.body.insertBefore(a,do {var h,n,a,e,g,m,f,l,j,i,k;h=d.currentStyle;n={W:d.clientWidth+1,H:d.clientHeight+1,w:this.imgSize[d.vmlBg].width,h:this.imgSize[d.vmlBg].height,L:d.offsetLeft,T:d.offsetTop,bLW:d.clientLeft,bTW:d.clientTop};a=(n.L+n.bLW==1)?1:0;e=function(b,p,q,c,s,u){b.coordsize=c+","+s;b.coordorigin=u+","+u;b.path="m0,0l"+c+",0l"+c+","+s+"l0,"+s+"xe";b.style.width=c+"px";b.style.height=s+"px";b.style.left=p+"px";b.style.top=q+"px"};e(d.vml.color.shape,(n.L+(d.isImg?0:n.bLW)),(n.T+(d.isImg?0:n.bTW)),(n.W-1),(n.H-1),0);e(d.vml.image.shape,(n.L+n.bLW),(n.T+n.bTW),(n.W),(n.H),1);g={X:0,Y:0};if(d.isImg){g.X=parseInt(h.paddingLeft,10)+1;g.Y=parseInt(h.paddingTop,10)+1}else{for(j in g){if(g.hasOwnProperty(j)){this.figurePercentage(g,n,j,h["backgroundPosition"+j])}}}d.vml.image.fill.position=(g.X/n.W)+","+(g.Y/n.H);m=h.backgroundRepeat;f={T:1,R:n.W+a,B:n.H,L:1+a};l={X:{b1:"L",b2:"R",d:"W"},Y:{b1:"T",b2:"B",d:"H"}};if(m!="repeat"||d.isImg){i={T:(g.Y),R:(g.X+n.w),B:(g.Y+n.h),L:(g.X)};if(m.search("repeat-")!=-1){k=m.split("repeat-")[1].toUpperCase();i[l[k].b1]=1;i[l[k].b2]=n[l[k].d]}if(i.B>n.H){i.B=n.H}d.vml.image.shape.style.clip="rect("+i.T+"px "+(i.R+a)+"px "+i.B+"px "+(i.L+a)+"px)"}else{d.vml.image.shape.style.clip="rect("+f.T+"px "+f.R+"px "+f.B+"px "+f.L+"px)"}},figurePercentage:function(d,c,f,a){var b,e;e=true;b=(f=="X");switch(a){case"left":case"top":d[f]=0;break;case"center":d[f]=0.5;break;case"right":case"bottom":d[f]=1;break;default:if(a.search("%")!=-1){d[f]=parseInt(a,10)/100}else{e=false}}d[f]=Math.ceil(e?((c[b?"W":"H"]*d[f])-(c[b?"w":"h"]*d[f])):parseInt(a,10));if(d[f]%2===0){d[f]++}return d[f]},fixPng:function(c){c.style.behavior="none";var g,b,f,a,d;if(c.nodeName=="BODY"||c.nodeName=="TD"||c.nodeName=="TR"){return}c.isImg=false;if(c.nodeName=="IMG"){if(c.src.toLowerCase().search(/\.png$/)!=-1){c.isImg=true;c.style.visibility="hidden"}else{return}}else{if(c.currentStyle.backgroundImage.toLowerCase().search(".png")==-1){return}}g=DD_belatedPNG;c.vml={color:{},image:{}};b={shape:{},fill:{}};for(a in c.vml){if(c.vml.hasOwnProperty(a)){for(d in b){if(b.hasOwnProperty(d)){f=g.ns+":"+d;c.vml[a][d]=document.createElement(f)}}c.vml[a].shape.stroked=false;c.vml[a].shape.appendChild(c.vml[a].fill);c.parentNode.insertBefore(c.vml[a].shape,c)}}c.vml.image.shape.fillcolor="none";c.vml.image.fill.typ {}DD_belatedPNG.createVmlNameSpace();DD_belatedPNG.createVmlStyleSheet();调⽤⽅式（fix⾥⾯的参数为css类）：window.onload = function(){DD_belatedPNG.fix(".msg0,.msg");}。
png图片不透明解决用FW将导航图片保存时选择PNG6以及索引透明，保存了先png透明解决第 1 种方法:定义一个样式,给某个div应用这个样式后，div的透明png背景图片自动透明了。
（注意两处图片的路径写法不一样，本例中，icon_home.png 图片与html文件在相同目录）<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title><style type="text/css"><!--.qq {height: 90px;width: 90px;background-image: url(icon_home.png)!important;/* FF IE7 */ background-repeat: no-repeat;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon_home.png '); /* IE6 */_ background-image: none; /* IE6 */}--></style></head><body><div class="qq"></div></body></html>第 2 种方法: 给img定义样式，页面上所有透明png即自动透明了。
