1. 程式人生 > >PNG24圖片兼容IE6解決的方法

PNG24圖片兼容IE6解決的方法

pan clear sta ie6 net tail statistic 原創 art

版權聲明:本文為博主原創文章。未經博主同意不得轉載。

https://blog.csdn.net/huangyibin628/article/details/25958325

非常多人都遇到一個問題:那就是PNG不能正常顯示,比方:

技術分享圖片

技術分享圖片

網上試過的非常多辦法都非常難實現。要嘛就是效果不好。那如今最好的辦法就是直接調用JS插件,解決!

點擊下載

如今說一下怎麽用這個文件吧!

首先看下代碼:

<!doctype html>
<html>
 <head>
  <meta charset="UTF-8">
  <title>PNG24兼容IE6</title>
  <style type=‘text/css‘>
	html,body {
		margin: 0;
		padding: 0;
	}
	.con{
		width:300px;
		height:300px;
		background:#fcf;
	}
	.con span {
		display:block;
		width: 80px;
		height: 80px;
		background:url(‘png24.png‘);
	}
	.con a {
		display:block;
		height:80px;
		width:80px;
		background:url(‘png24.png‘);
	}

  </style>
 </head>
 <body>


<!-- 
[if ie 6]>
	<script src=‘js/IE6PNG.js‘></script>
	<script type=‘text/javascript‘>IEPNG.fix(‘div,span,a,img‘)</script>
<![endif] -->

<div class=‘con‘>
	<img src=‘png24.png‘ alt=‘‘ title=‘‘ />
	<span></span>
	<a></a>
	
</div>

 </body>
</html>


<!--http://url.cn/O9YnJI-->

註意一下在body中增加的這句代碼:

<!--
[if ie 6]>
<script src=‘js/IE6PNG.js‘></script>
<script type=‘text/javascript‘>IEPNG.fix(‘div,span,a,img‘)</script>
<![endif] -->

在css中將須要使用透明PNG的元素寫進IEPNG.fix裏,哪個標簽用到png24就在 IEPNG.fix(‘這裏放用到的標簽名。多個標簽逗號隔開‘) 。

技術分享圖片


技術分享圖片

PNG24圖片兼容IE6解決的方法