首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

IE PNG透明度

IE PNG透明度是指图片在网页中显示时,不透明度(alpha值)的一种设置。它可以让图片在网页中实现半透明效果,增加视觉层次感和用户体验。

在IE浏览器中,PNG图片的透明度是默认的,无法设置。而在其他浏览器中,如Firefox、Chrome、Safari等,PNG图片的透明度是可以设置的,但需要使用特定的CSS代码。

在CSS中,可以使用以下代码来设置PNG图片的透明度:

代码语言:css
复制
img {
  filter: alpha(opacity=50); /* IE */
  opacity: 0.5; /* 标准 */
}

其中,opacity: 0.5表示透明度为0.5,也就是50%。

另外,还有以下一些常用属性也可以用来设置PNG图片的透明度:

  • filter:IE浏览器专有属性,用于设置图片的透明度。例如:filter: alpha(opacity=50)
  • opacity:标准属性,用于设置元素的透明度。例如:opacity: 0.5
  • rgba():用于设置元素的透明度。例如:rgba(0, 0, 0, 0.5)
  • hsla():用于设置元素的透明度。例如:hsla(0, 0, 0, 0.5)

需要注意的是,在设置PNG图片的透明度时,需要确保图片的格式为PNG-8或PNG-24,而不是GIF或BMP。因为只有PNG格式的图片才支持透明度。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

关于IE6的PNG图像透明使用AlphaImageLoader的缺点

PNG32的alpha透明效果在IE6下会出现bug,出现灰色背景。而目前的解决方案就是 IE提供的滤镜。需要注意的是滤镜并不是对原图片进行修改,而是对相应的html元素进行 修改。...现总结使用滤镜的缺点:   1,IE6下使用滤镜,那么无法对该PNG图片进行定位。可以通过其他解决方案完成。这篇 文章提到了两种解决方案,分别是硬编码和clip方案。   ...当页面有多个图片使用了透明PNG(对于IE6),那么 滤镜的处理是叠加的,得等到所有PNG图片下载完成之后才能开始渲染,在此之前呈现给我们的将是 空白页面。   ...可以使用PNG8图片进行渐进增强。PNG8支持alpha通道,而且PNG8的半透明像素会在IE6下显示为 完全透明。这就提供了向下兼容的方案。...在IE7及其以上的浏览器显示alpha透明度,而在IE6下为全透明。

84080

极限压缩 PNG

极限压缩 PNG 2017-11-29 12:17 为了让博客的访问者有更快的访问速度,同时兼顾显示效果,我们有些选择却不多——比如选用 WebP...但考虑到浏览器兼容性问题,有时不得不考虑依然 PNG。 这里我找到一款极限 PNG 压缩工具——LimitPNG。 ---- limitPNG - PNG 图片极限压缩工具 ?...在极限压缩的时候,压缩一张 PNG 的耗时真的很长,几分钟算是很理想的状态了。部分图片压缩比依然不够大,不过如果愿意丢失一点点精度,可以换取非常大的压缩比提升。...考虑到大量图片批量压缩,作者又做了另外一款软件: gluttonyPNG – 大批量 PNG 图片压缩工具 于是,应该能应付日常各种需要极限压缩的场景了。...本文会经常更新,请阅读原文: https://walterlv.com/post/limit-png.html ,以避免陈旧错误知识的误导,同时有更好的阅读体验。

94620

PNG文件解读(2):PNG格式文件结构与数据结构解读—解码PNG数据

文件中剩余的部分由3个以上的PNG的数据块(Chunk)按照特定的顺序组成,因此,一个标准的PNG文件结构应该如下: PNG文件标志PNG数据块……PNG数据块 与JPEG格式如下 SOI MarkerMarker...png数据结构个人觉得比jpeg复杂 jpeg:段标识(FF)+段类型(1字节)+段长度(2字节)+数据块 png:段长度(4字节)+段类型/类型标志(4字节)+数据块+校验码(4字节) png的每一段...关键数据块定义了4个标准数据块,每个PNG文件都必须包含它们,PNG读写软件也都必须要支持这些数据块。虽然PNG文件规范没有要求PNG编译码器对可选数据块进行编码和译码,但规范提倡支持可选数据块。...数据块连起来,大概这个样子: PNG 标识符PNG 数据块(IHDR)PNG 数据块(其他类型数据块)…PNG 结尾数据块(IEND) 就是一段段数据按照固定格式填充,头尾必要,中间填充图片的压缩数据。...Costello开发的7遍隔行扫描方法) 由于我们研究的是手机上的PNG,因此,首先我们看看MIDP1.0对所使用PNG图片的要求吧: 在MIDP1.0中,我们只可以使用1.0版本的PNG图片。

2.8K30

PNG文件解读(2):PNG格式文件结构与数据结构解读—解码PNG数据

文件中剩余的部分由3个以上的PNG的数据块(Chunk)按照特定的顺序组成,因此,一个标准的PNG文件结构应该如下:PNG文件标志PNG数据块……PNG数据块与JPEG格式如下SOI MarkerMarker...png数据结构个人觉得比jpeg复杂jpeg:段标识(FF)+段类型(1字节)+段长度(2字节)+数据块png:段长度(4字节)+段类型/类型标志(4字节)+数据块+校验码(4字节)png的每一段,称之为数据块...关键数据块定义了4个标准数据块,每个PNG文件都必须包含它们,PNG读写软件也都必须要支持这些数据块。虽然PNG文件规范没有要求PNG编译码器对可选数据块进行编码和译码,但规范提倡支持可选数据块。...数据块连起来,大概这个样子:PNG 标识符PNG 数据块(IHDR)PNG 数据块(其他类型数据块)…PNG 结尾数据块(IEND)就是一段段数据按照固定格式填充,头尾必要,中间填充图片的压缩数据。...Costello开发的7遍隔行扫描方法)由于我们研究的是手机上的PNG,因此,首先我们看看MIDP1.0对所使用PNG图片的要求吧:在MIDP1.0中,我们只可以使用1.0版本的PNG图片。

3.1K11

【多媒体】PNG简介

png是一种常见的无损压缩图片格式。在说png前,我们来提提png的历史。说历史就不得不提一下它的对手gif,下面这个会动的超可爱的小姐姐就是一张gif图片。 ?...(8950 4e47 0d0a 1a0a便是png的魔数) 然后是每个png的开头数据块——文件头数据块。文件头数据块记录了png的一些基本信息,可以理解为png的大纲或者是身份证。...说完png的文件头,接下来来说图像数据块。下面这张图就是png图像数据块的处理过程。...最后在压缩完主要数据后就剩一些细枝末节,png会删除掉一些冗余的数据,然后就到了png的结尾数据块了。...开始时说到,png是由于gif的专利收费而被逼出来的。由于gif的收费,png迅速崛起,快速抢占了gif的市场,最终我们可以看到如今网络世界中png和gif平分天下。

1.7K20

iMac下制作含透明度图片及判断图片透明度

最近在做安装包优化相关的内容,期间遇到了一个问题,怎么检查一张图片是不是有透明度,发现mac下面没有很好的工具,这部分内容难度也很低,所以就自己顺手写了一个简单的工具。...关于为什么要检查一张图片是不是有透明度,我后面会在介绍安装包优化的详细介绍。 iMac下怎么制作含透明度图片 在macOS中自带的预览十分强大,我们可以通过预览来直接制作一些透明效果的PNG图片。...文件对比 这里是修改后的两个文件的一个简单的对比效果,可以看到png的大小明显增加: ?...怎么判断图片是否有渐变或者透明度 源码地址: https://github.com/bihe0832/getImageInfo 关于工具的详细使用介绍可以参考源码中的README文件。.../png_test_head.png {"ret":0,"msg":"图片是否有渐变: true ,图片尺寸为(宽*高): 344 * 344 , 图片大小: 33 KB,图片类型: 6","hasAlpha

2.4K30

DD_belatedPNG 与 unitpngfix 两种解决 IE6 中 PNG 图片透明问题方案横向对比

虽然 IE6 骂声不断,但是仍然还有不少的市场份额。而在网页中,png 文件体积小、无锯齿、透明度好而被广泛使用。...当这两件事情碰在一起,问题就来了,IE6 不支持 PNG 透明图片,它会把透明的部分显示成白色的。...知更鸟已经写了一篇比较简单的使用方法:使用DD_belatedPNG让IE6支持PNG透明图片 官方的英文版提供了更加详细的教程:点击这里 unitpngfix.js 方法 unitpngfix.js...IE6 来加载这个页面 成功的显示出了白色的背景,哦也!...当然这个与 IEtest 的不稳定也有关,在原生IE6下测试应该不会出现这种情况(未测试),在之前的实际使用中,偶尔会出现这种情况。

39310

win2d 通过 CanvasActiveLayer 画出透明度和裁剪 创建 CanvasActiveLayer 方法透明度透明度图片裁剪

本文告诉大家如果在 UWP 的 win2d 通过 CanvasActiveLayer 创建一层,在这里画出的图片有透明度或者裁剪 在 win2d 如果需要对某个元素裁剪,可以使用很多方法,本文只是告诉大家使用图层的方法裁剪...// 这里面写的代码会在这个 Layer 里面 } // 在外面写的代码不会添加到这个 layer 里面 透明度...} // 在这里写的代码是普通的 } } 这里的 CreateLayer 有很多重载,现在使用的是一个传入透明度的方法...,这里的透明度使用 [0,1] 的范围 在 using 里面画出的内容就会加上了这里设置的值,如我需要画出 0.6 的圆形 using (var canvasActiveLayer =...从代码可以看到 CreateLayer 的设计是创建一个简单的方法,在这个方法里面可以快速设置画出的界面,同时在这个方法外面将会和之前一样 透明度图片 除了直接设置透明度的值,还可以设置透明度的 Brush

1.6K20
领券