解决a标签为空IE浏览器无法显示

作者:norion时间:2012年6月27日评论次数:0 条

最近给项目做一个可以切换的幻灯片,但是要求有用两个空的a标签用绝对定位来摆放,相信有很多人一定用过这样的效果,但是当a标签为空且没有背景,问题就来了IE浏览器下,a标签表现成display:inline,不管给它怎么设置z-index还是display:block都不显示。

我的css代码是这样的:

.indexBanner1{width:390px;height:613px;position:absolute;top:0;display:block}
	.indexBanner1-item1{left:0}
	.indexBanner1-item2{right:0}

html标签是这样的:

<a href="?m=photo&id=indexBanner1-sub1" class="indexBanner1 indexBanner1-item1"></a>
<a href="?m=product&cid=1" class="indexBanner1 indexBanner1-item2"></a>

按照w3c标准这样写是没有写是没有错的,但是我要理解变态的IE,它将空的A标签且设置了position:absolute而没有背景理解为A标签不存在。。。

解决这个问题,要在A标签添加一个背景,我是这样写CSS的:

.indexBanner1{width:390px;height:613px;position:absolute;top:0;display:block;background:#fff;opacity:0;filter:alpha(opacity=0);}
	.indexBanner1-item1{left:0}
	.indexBanner1-item2{right:0}

标签:

上一篇: 简单的jQuery左右滚动相册插件

下一篇:用javascript让IE也兼容audio、video

相关文章

评论

发表评论

电子邮件地址不会被公开。 必填项已用*标注