首页 > 网络编程 > JavaScript > 网页特效 > 导航菜单 > 菜单高亮显示

js兼容IE6,IE7菜单高亮显示效果代码

2008-07-02 12:50:29 作者：

原来做了一个菜单在IE7下正常没想到在IE6下却没有效果，后来改成使用JS实现虽然是实现的，但总觉得不是很好，在网上找了些资料，用CSS实现了。

<!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>兼容IE6,IE7菜单高亮显示</title>  
</head>  
<style type="text/css">  
*{  
    font:12px tahoma;  
}  
#menu li{  
    list-style:none;  
    width:88px;  
    height:30px;  
    float:left;  
    background:#EFF1F5;  
    text-align:center;  
    margin:0;  
    overflow:hidden;

}  
#menu li a{  
    display:block;  
      
}  
#menu li a:link,#menu li a:visited{  
    text-decoration:none;  
    padding:8px 0;  
}  
#menu li a:hover{  
    background:#B8C0D3;  
}  
</style>  
<body>  
<ul id="menu">  
    <li><a href="https://www.jb51.net/">脚本之家</a></li>  
    <li><a href="https://www.jb51.net/">脚本之家</a></li>  
    <li><a href="https://www.jb51.net/">脚本之家</a></li>  
    <li><a href="https://www.jb51.net/">脚本之家</a></li>  
    <li><a href="https://www.jb51.net/">脚本之家</a></li>  
    <li><a href="https://www.jb51.net/">脚本之家</a></li>  
</ul>  
</body>  
</html>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

js兼容IE6,IE7菜单高亮显示效果代码

您可能感兴趣的文章: