菜单兼容性有关问题，ie6 不识别.menu ul li:hover ul li a:hover吗-HTML教程-爱易网页

菜单兼容性有关问题，ie6 不识别.menu ul li:hover ul li a:hover吗

日期：2014-05-17　浏览次数：20670 次

菜单兼容性问题，ie6 不识别.menu ul li:hover ul li a:hover吗？请指教
ie6 不识别.menu ul li:hover ul li a:hover吗？为什么显示不出来二级菜单

HTML code


<!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=utf-8" />
<title>nav-test</title>
<style type="text/css">
#sbdmenu{}
#sbdmenu .menu {
font-family: arial, sans-serif;
width:700px;
margin:0;
margin:0;
}

#sbdmenu .menu ul {
padding:0;
margin:0;
list-style-type: none;
}

#sbdmenu .menu ul li {
float:left;
position:relative;

}

#sbdmenu .menu ul li a, #sbdmenu .menu ul li a:visited {
display:block;
text-align:center;
text-decoration:none;
width:70px;
height:70px;
color:#000;
line-height:30px;
font-size:14px;

}

#sbdmenu .menu ul li ul {
display: none;
}

#sbdmenu .menu ul li:hover a {
color:#000;
font-size:14px;
font-weight:600;
}

#sbdmenu .menu ul li:hover ul {
display:inline;
position:absolute;
top:38px;
left:0;
width:700px;

}

#sbdmenu .menu ul li:hover ul li a {
display:inline;
background:#69859f;
color:#fff;
padding:4px;
font-size:12px;
font-weight:normal;
}

#sbdmenu .menu ul li:hover ul li a:hover {
background:#69859f;
color:#fff;
font-size:12px;
font-weight:normal;

}
</style>

</head>
<body>
<table width="734" height="119" border="0" cellpadding="0" cellspacing="0">
       <tr>
       <td height="39"></td>
       </tr>
       <tr>
         <td height="79" valign="top"> 
         <div id="sbdmenu">
 <div class="menu">
<ul>
<li><a href="#" class="hide">Home</a>
</li>

<li><a class="hide" href="#">About US</a>

</li>
<li><a class="hide" href="#">Products</a>
<ul>
<li><a href=" #" >P1</a></li>
<li><a href=" #" >P2</a></li>
<li><a href=" #">P3</a></li>
<li><a href=" #" >P4</a></li>
</ul>
</li>


<li><a class="hide" href="#">News</a>

<ul>
<li><a href="#">N1</a></li>
<li><a href="#">N2</a></li>
</ul>

</li>
<li><a class="hide" href="#">Feedback</a>

<ul>
<li><a href="#">f1</a></li>
<li><a href="#">f2</a></li>
<li><a href="#">f3</a></li>

</ul>

</li>

<li><a class="hide" href="#">Contact</a>

</li>

</ul>

<div class="clear"> </div>
</div>
</div>
</td>
</tr>
 </table>
</body>
</html>

------解决方案--------------------
不识别li:hover这种写法。

这样的问题网上有解决方法

css 菜单
------解决方案--------------------
我也是这样问题,坐等高手解决！
------解决方案--------------------
哦，css菜单
------解决方案--------------------
不识别li:hover这个，不过，可以用一段jquery代码搞定：
$('.menu ul li').mouseover(function(){
$(this).find('ul').show();
$(this).addClass('lihover');
});
$('.menu ul li').mouseout(function(){
$(this).find('ul').hide();
$(this).removeClass('lihover');

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

菜单兼容性有关问题，ie6 不识别.menu ul li:hover ul li a:hover吗

相关资料更多>

推荐阅读更多>