a标签position为absolute时，IE无法点击（a position:absolute bug ie）

为什么要把a标签搞为absolute呢？很多时候为了覆盖在其他html标签上，实现一些点击，比如一个flash广告，要想在整个flash上加一个链接，单击整块flash链接到某个网页。

 

用一个绝对定位的a标签覆盖在flash上：

<style>
.flash { width:200px;height;200px;position:relative; }
.flash-link { position : absolute; z-index : 2 ;  left: 0; top: 0 ; width: 100%; height: 100%; display: block; }
.flash-object { position : absolute; z-index: 1; left: 0; top: 0; width:300px; height:80px; }
</style>

<div class="flash">
<a class="flash-link"></a>
<div class="flash-object"><object>....flash嵌入代码</object> </div>
</div>

Firefox，Chrome， Opera等所有非IE浏览器均可以单击。但IE系列的浏览器却不行，经过仔细测试，发现a标签虽然display为block; 并且拥有width:100%; height:100%;但a这个时候表现的还是像inline元素一样，如果存在文字，则有文字链接，如果不存在，则完全点不到。

 

 

解决方法(让a变成块状block)：

 

方法1.

 

给a加上一个background属性，写法：

 

background:url(about:blank) 或  background:url(#)

 

 

方法2. (推荐！)

 

给a加任意背景颜色，再把透明度设为透明(隐藏颜色)，写法：

 

background:#fff;opacity:0; filter:alpha(opacity=0);

爆笑家园，24小时内，冷笑话、爆笑内容与您分享 www.51laugh.cn