ie6 下最佳 PNG透明方案【转】

“咳! 哎!….. :-(

你听见了么? 这些都是大家抱怨IE6下不能实现png图片漂亮的明效果的哀叫声,的确是无奈呀…..

不过现在幸运的是,我们能够让这一切的抱怨都停止.

网络上解决IE6下Png透明解决方案有很多,例如 IE PNG Fix from TwinHelix, Javascript IE PNG Fix, Transparent PNGs in Internet Explorer 6 from 24 ways. 等等.
然而现在,我要和你分享的是 Unit PNG Fix .
因为它的确是太出众了.

1.非常小的javascript文件:1kb!
2.解决因为IE的滤镜属性所带来的影响.
3.无论是img元素或background-image属性,都能有效果.
4.在加载页面之前就能自动运行.或者就一丁点的元素.
5.允许自动高宽.
6.使用起来超级简单.


如何使用:

1).下载zip 然后,添加下面的代码到你页面的头部.(一定要确保路径的正确)
<!--[if lt IE 7]>
        <script type="text/javascript" src="unitpngfix.js"></script>
<![endif]-->

2).添加clear.gif到你的images 文件夹中.在js文件中,修改“var clear=”images/clear.gif” 路径,为 你存放clear.gif的文件路径.

3). 你的整个项目的png图片都实现了透明效果.的确非常简单吧?就2个步骤,就实现了整个站点所有png的透明效果.
一些注意事项:

Unit PNG Fix能够让 background-repeat在ie6下工作,不过这种工作方式不 是像正常的repeat图片重复的效果,而是采用了拉伸的效果.但是,仍然是效果 的,所以这也是非常不错的.因为没有任何一个解决方案能够实现ie6下透明滤镜重复图片这个功能.

就这些了,现在你可以开始动手实践了.

地址呢?其实上面已经有写了 怕你找不到 再给个入口 Unit PNG Fix

转载于:https://www.cnblogs.com/pomp/archive/2010/05/12/1734025.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/362756.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

安装svn、git等托管软件

安装软件&#xff0c;配置环境。下面我找到的别人写的&#xff0c;写的都很详细&#xff0c;做个记录。就不在这里写具体步骤了。 1.nodejs安装 使用vue-cli 搭建项目的时候需要nodejs&#xff0c;node是比较方便的&#xff0c;打包部署&#xff0c;解析vue单文件组件&#xff…

HBase:为客户行为生成搜索点击事件统计信息

在本文中&#xff0c;我们将探索HBase来存储客户搜索点击事件数据&#xff0c;并利用其基于搜索查询字符串和构面过滤器点击来获取客户行为信息。 我们将介绍如何使用MiniHBaseCluster&#xff0c;HBase Schema设计&#xff0c;使用HBaseSink与Flume集成以存储JSON数据。 在之…

WildFly 8.1.0.Final上的SwitchYard 2.0.0.Alpha1入门

最近&#xff0c;我一直在关注一些热门的RedHat技术&#xff0c;在其中很多有趣的部分中&#xff0c;我找到了SwitchYard 。 过去&#xff0c;对于所有人都围绕SOA和面向服务的体系结构不屑一顾&#xff0c;这对我来说一直很奇怪&#xff0c;作为Java EE开发人员。 过去&#…

zTree 优秀的jquery树插件

zTree 优秀的jquery树插件,文档详细&#xff0c;渲染快 使用方法&#xff1a; 1、引用zTree的js和css文件   <link href"~/Content/zTree_v3/css/zTreeStyle/zTreeStyle.css" rel"stylesheet" /><script src"~/Content/zTree_v3/js/jque…

Android 小項目之---Iphone拖动图片特效 (附源码)

曾经被Iphone用手指在屏幕上滑来滑去拖动图片的操作方式吸引吗&#xff1f;在Android里头&#xff0c;这并不是什么难事。 所需要的技术点如下&#xff1a;Android.content.Context 、Android.widget.BaseAdapter、Android.widget.ImageView等通常会用在设计相册、 图片类型的选…

前端打印功能

方法一&#xff1a; html代码&#xff1a; 在要打印的内容上加入&#xff1a;<!--startprint-->和<!--endprint--> js代码&#xff1a; $(.printData).click(function(){bdhtmlwindow.document.body.innerHTML; sprnstr"<!--startprint-->"; …

同步多线程

同步多线程&#xff08;SMT&#xff09;是一种在一个CPU 的时钟周期内能够执行来自多个线程的指令的硬件多线程技术。本质上&#xff0c;同步多线程是一种将线程级并行处理&#xff08;多CPU&#xff09;转化为指令级并行处理&#xff08;同一CPU&#xff09;的方法。 同步多线…

Centos7安装Python3的方法

由于centos7原本就安装了Python2&#xff0c;而且这个Python2不能被删除&#xff0c;因为有很多系统命令&#xff0c;比如yum都要用到。 [rootVM_105_217_centos Python-3.6.2]# python Python 2.7.5 (default, Aug 4 2017, 00:39:18) [GCC 4.8.5 20150623 (Red Hat 4.8.5-16)…

ajax请求导致status为canceled的原因

在使用layui的form表单提交以后&#xff0c;请求状态总是canceled。后来在form表单的后面添加了一行代码&#xff1a; return false; 就可以了。 文档&#xff1a;https://www.layui.com/doc/modules/form.html#onsubmit 错误&#xff1a; 解决方法&#xff1a; 总结一下&…

点击返回上一页失效

点击取消的时候&#xff0c;返回上一页&#xff0c;没有效果&#xff0c;仍然停留在当前页&#xff0c;还报500&#xff1b;改成window.history.go(-1)也不生效 代码&#xff1a; <button class"st-btn-normal st-btn-cancel cancle" onclick"javascript:wi…

如何通过7个Logback调整立即改善Java日志记录

基准测试可帮助您发现Logback在压力下的性能 日志记录对于服务器端应用程序是必不可少的&#xff0c;但这是有代价的。 令人惊讶的是&#xff0c;微小的更改和配置调整对应用程序的日志记录吞吐量有多大影响。 在这篇文章中&#xff0c;我们将根据每分钟的日志条目对Logback的性…

JS中的编码

今天发现我输入的中文变成了另外一种格式&#xff0c;查了一下&#xff0c;原来是转换成了数字编码。在这里介绍一下数字编码和base64&#xff0c;做个记录 1.出现原因&#xff1a;在开发中经常需要对用户输入的数据进行编码然后才能通过HTTP请求发送给后台&#xff0c;或者对…

【Flutter】解决依赖版本冲突

为什么会存在版本依赖问题 我们在开发flutter项目中&#xff0c;常常会依赖第三方库。flutter依赖项越多&#xff0c;就越有可能出现依赖版本冲突。 Because new_trend depends on build_runner >0.9.0 which requires SDK version >2.0.0-dev.61 <3.0.0, version sol…

安装vue-cli时报错

今天用npm安装vue-cli时一直报错&#xff0c;后面百度说用cnpm重装&#xff0c;结果还是报错&#xff0c;后面找到一个博主的&#xff0c;说是vue升级的原因&#xff0c;vue init webpack hello-world 已经替换为 vue create hello-world npm install -g vue/cli-init # vue…

CenterNet算法笔记(目标检测论文)

论文名称&#xff1a;CenterNet: Keypoint Triplets for Object Detectiontection 论文链接&#xff1a;https://arxiv.org/abs/1904.08189 代码链接&#xff1a;https://github.com/Duankaiwen/CenterNet 简介 该论文是由中科院&#xff0c;牛津大学以及华为诺亚方舟实验室联合…

elementUI的container布局设置全屏宽度

进用element UI的 container 布局&#xff0c;发现不能全屏铺满 添加了一行代码&#xff1a; .el-container{height:100%;padding:0;margin:0;width:100%;}发现高度占满全屏&#xff0c;但是宽度还没有 继续给 html,body加了 width&#xff1a;100%&#xff1b;还是没有任何…

CSS border-radius边框圆角

在CSS3中提供了对边框进行圆角设定的支持&#xff0c;可对边框1~4个角进行圆角样式设置。 目录 1. 介绍 2. value值的格式和类型 3. border-radius 1~4个参数说明 4. 在线示例 1. 介绍 1.1 圆角属性 CSS3提供了5种圆角属性 border-radius &#xff1a;同时设置4个边框的…

element实现动态路由+面包屑

要掌握&#xff1a;localStorage&#xff0c;组件封装 ​​​​ emm&#xff0c;第一次上传视频转gif的图片&#xff0c;效果不咋好。。。 视频转gif 的软件连接 http://www.zxt2007.com/downloads.html 找到一个可以截取部分视频制作gif图的软件https://soft.onlinedo.cn/gif…

Oracle最新的Java 8更新破坏了您的工具-它是如何发生的?

如果您最近一直在关注Java世界的消息&#xff0c;那么您可能听说过Oracle发布的最新Java 8构建&#xff0c;Java 8u11&#xff08;和Java 7u65&#xff09;引入了错误并破坏了一些流行的第三方工具&#xff0c;例如ZeroTurnaround的JRebel&#xff0c;Javassist&#xff0c;Goo…

为什么选择Dojo - 记Dojo中文博客正式开张

公告栏里写到&#xff1a;Dojo的高门槛一旦跨过&#xff0c;必将别无所求。含义有二&#xff1a;第一&#xff0c;Dojo难学&#xff1b;第二&#xff0c;Dojo很强大。 这也揭示了本博客的目标&#xff1a;帮助大家用好Dojo这个优秀的Ajax框架。 在回答为什么选择Dojo之前&#…