CSS制作网页的问题

来源:百度知道 编辑:UC知道 时间:2024/06/06 13:00:00
下边的这段特效在IE下点击图片无法链接,只有点字才行 ,大家帮看看问题在那里~!FF下是正常的!
<style>
h2{font-size:14px; font-weight:bold; padding:10px 0; margin:5px 0; border-bottom:1px solid #ccc;}
.box2{}
.box2 img{display:block; padding:2px; border:0;}
.box2 a{color:#333; text-decoration:none;border:2px solid #FFF; float:left; cursor:hand;}
.box2 a span{display:none; color:#F00;}
.box2 a span h1{font-size:12px; position:absolute; bottom:0; background:#333; color:#FFF; font-weight:normal; text-align:center; width:128px; padding:4px; display:block;
filter:alpha(opacity=60);
-moz-opacity:0.60;
opacity:0.60;
}
.box2 a:hover{color:#999; border:2px solid #333; }
.box2 a:hover span{display:inline; position:absolute;}

</style>
</head>

<body>
<h2>CSS切换图片效果</h2>
<div class="box2">
<a href="#"><span><h1>未处理</h1><img src=&quo

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>

<style>
.test{}
.test a{ display:block; float:left; height:210px; position:relative; text-decoration:none;}
.test a span{ display:none; }
.test a:hover{filter:alpha(opacity=60); -moz-opacity:0.60;opacity:0.60; }
.test a:hover span{ display:block; text-decoration:none; position:absolute; left:0; bottom:0; color:#FFF; background:#333; font-weight:normal; text-align:cen