CSS代码:
引用
.pngbg{background:url(menubarbg.png) no-repeat;}
.pnglink{height:145px;width:232px;}
#area{left:20px;top:20px;position:relative}
Html代码:
引用
PNG-A-HREF-Cann't Click
几个注意的地方,这个是解决IE下出现的问题,FF没问题
1.ID=area的DIV,是放置PNG背景层上的内容,此DIV需有position属性,absolute
或者relative都行,position有继承关系,所以最好前面的DIV也设置position,这样定位方便.
2.背景的高度定义在.pnglink这个class里面,不可定义在pngbg的class里面
///我使用后的心得
不需要这么复杂,问题在于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代码:
class="Relative">
id="NewsItems">
...
id="More">