用纯CSS做了个下拉菜单,在火狐下面,显示正常,但在IE下不显示 ,网上有人说IE6以下,不支持除了a之外的hover伪类,我仿照别人的方案,在<li>内加了a标签,可是还是不行,估计是CSS的问题,我将代码贴出来,请大家,帮我找找原因,谢谢
html代码:
<DIV id=div_lnb style="Z-INDEX: 100">
<UL>
<li><a href='#nogo'><span>首页</span></a></li>
<!-- 开始 -->
<li class=menu>
<!--[if lte IE 6]><A
href="#nogo">
<TABLE>
<TBODY>
<TR>
<TD><![endif]-->
<span><a href="#nogo" target="_blank">CSS下拉菜单</a></span>
// 当属标移动到这里时,呼叫出隐藏的 <dl> 将此外覆盖
<dl>
<dt>CSS下拉菜</dt>
<dd><a href="#about1">游戏特色</a></dd>
<dd><a href="#about2">游戏内容</a></dd>
<dd><a href="#about3">游戏介绍</a></dd>
<dd><a href="#about4">游戏界面</a></dd>
</dl><!--[if lte IE 6]></TD></TR></TBODY></TABLE></A><![endif]-->
</li>
<!-- 结束 -->
<li><a href='{dede:global.cfg_cmsurl/}/'><span>其它频道</span></a></li>
<li><a href='{dede:global.cfg_cmsurl/}/'><span>其它频道</span></a></li>
<li><a href='{dede:global.cfg_cmsurl/}/'><span>其它频道</span></a></li>
<li><a href='{dede:global.cfg_cmsurl/}/'><span>其它频道</span></a></li>
</UL></DIV>
CSS代码:
#div_lnb {
Z-INDEX: 2; BACKGROUND: url(/ima/lnb.gif) no-repeat; MARGIN: 0px 0px 10px; POSITION: relative
}
#div_lnb UL {
PADDING-RIGHT: 0px;
PADDING-LEFT: 110px;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
WIDTH: 800px;
PADDING-TOP: 0px;
LIST-STYLE-TYPE: none;
height: 48px;
}
#div_lnb UL LI {
FLOAT: left;
WIDTH: 107px;
text-align: center;
padding-top: 10px;
margin-top: 5px;
height: 25px;
}
#div_lnb UL LI span {
color: #FFFFFF;
font-size: 14px;
font-weight: bold;
}
#div_lnb UL LI A {
DISPLAY: block; WIDTH: 107px;
}
#div_lnb ul .menu {
}
#div_lnb ul .menu span a {
display: block;
text-decoration: none;
color: #FFFFFF;
font-size: 14px;
font-weight: bold;
height: 25px;
}
#div_lnb ul .menu dl {
display: none;
height: 150px;
width: 107px;
left: 217px;
top: 4px;
position: absolute;
padding-bottom: 10px;
background-image: url(../ima/lnb2.gif);
background-repeat: no-repeat;
background-position: 0px 0px;
}
#div_lnb ul li:hover dl {
display: block;
}
#div_lnb ul .menu a:hover dl {
display: block;
}
#div_lnb ul .menu a table {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 1em; PADDING-BOTTOM: 0px; MARGIN: -1px; PADDING-TOP: 0px; BORDER-COLLAPSE: collapse
}
#div_lnb ul .menu dl dt {
display: block;
height: 28px;
font-weight: bold;
font-size: 14px;
line-height: 30px;
color: #FFFFFF;
padding-top: 4px;
}
#div_lnb ul .menu dl dd a {
display: block;
overflow: hidden;
height: 29px;
font-weight: normal;
font-size: 13px;
line-height: 30px;
color: #FFFFFF;
}
#div_lnb ul .menu dl dd a:hover {
font-size: 13px;
color: #FF0033;
}
-->