CSS代码:
<style type="text/css">
.pngbg{background:url(menubarbg.png) no-repeat;}
.pnglink{height:145px;width:232px;}
#area{left:20px;top:20px;position:relative}
</style>
<!--[if lt IE 7]><style>
.pngfixed {filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='menubarbg.png', sizingMethod='crop');
}
.pngbg {background-image: none;}
</style><![endif]-->
<div class="pngbg pnglink">
<div class="pnglink pngfixed">
<div id="area">
<a href="http://www.enterdesk.com">Fixed PNG-A-HREF-Cann't Click</a>
</div>
</div>
</div>
能点和不能点的演示地址:http://www.dodo.hk/play/png.html
///我使用后的心得
不需要这么复杂，问题在于PNG层的CSS不要设置为Position:Relative;可以在中间加一个Relative层，在这个层里面加上内容,其上的事件都可以响应。
CSS代码：
.Relative
{
position:relative;
}
div#News
{
width:365px;height:188px;background:url('/Images/beijing.png') no-repeat;float:left;
}
* html div#News { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src="/Images/beijing.png");background-image: none; }
div#News div#More
{
width:39px;height:13px;position:absolute;top:160px;right:10px;background:url('/Images/more.gif') no-repeat;
}
div#News div#NewsItems
{
width:340px;height:110px;position:absolute;top:45px;left:15px;
}
HTML代码：
<div id="News">
<div class="Relative">
<div id="NewsItems">
...
</div>
<div id="More"></div>
</div>
</div>
此内容由惯性聚合(RSS阅读器)自动聚合整理，仅供阅读参考。 原文来自 — 版权归原作者所有。