<!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></title>
</head>
<style type="text/css">
body { margin:0px; padding:0px;
font-family: "宋体";
font-size: 12px;
}
#lists {list-style:none; position:relative;float:left; width:200px}
#lists li {display:inline; float:left;;}
#lists li a.tl {display:block; width:15px;text-decoration:none; font-size: 11px;color: #666666;font-family:Arial, Helvetica, sans-serif;font-weight: bold; text-align:center;}#lists div {display:none;}#lists li a:hover {text-decoration:underline; white-space:normal; color:#FF6600; background-color:#eaf9ff; border:1px solid #cff1ff}
#lists li:hover a {text-decoration:underline; white-space:normal; color:#FF6600}#lists :hover div
{display:block; width:398px; background:#eaf9ff; position:absolute; left:0; top:25px; border:1px solid #cff1ff; padding-bottom:10px; }#lists :hover div dl {display:inline; padding:0; margin:0 10px 10px 10px; float:left; width:179px;}#lists :hover div dl dd {padding:0; margin:0;
}
#lists :hover div dd a {display:block; text-decoration:none; font-weight:normal; font-size:12px; color:#000; text-indent:10px; line-height:15px;}
#lists :hover div dd a:hover {text-decoration:underline;}#lists .clear {clear:both;}
</style>
<body>
<div style="float:left; width:200px;">
<ul id="lists">
<li>a href="#" class="tl" >A</a>
<div >
<dl>
<dd><a href="#">Alabama</a></dd>
<dd><a href="#">Alaska</a></dd>
</dl>
<dl>
<dd><a href="#">Delaware</a></dd>
<dd><a href="#">Florida</a></dd>
</dl>
<dl>
<dd><a href="#">Nebraska</a></dd>
<dd><a href="#">Nevada</a></dd>
</dl>
</div></li>
</div>
</body>
</html>
怎么让他能在IE6下显示 隐藏的呢,大家帮帮忙! 谢谢了!
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
</head>
<style type="text/css">
body { margin:0px; padding:0px;
font-family: "宋体";
font-size: 12px;
}
#lists {list-style:none; position:relative;float:left; width:200px}
#lists li {display:inline; float:left;;}
#lists li a.tl {display:block; width:15px;text-decoration:none; font-size: 11px;color: #666666;font-family:Arial, Helvetica, sans-serif;font-weight: bold; text-align:center;}#lists div {display:none;}#lists li a:hover {text-decoration:underline; white-space:normal; color:#FF6600; background-color:#eaf9ff; border:1px solid #cff1ff}
#lists li:hover a {text-decoration:underline; white-space:normal; color:#FF6600}#lists :hover div
{display:block; width:398px; background:#eaf9ff; position:absolute; left:0; top:25px; border:1px solid #cff1ff; padding-bottom:10px; }#lists :hover div dl {display:inline; padding:0; margin:0 10px 10px 10px; float:left; width:179px;}#lists :hover div dl dd {padding:0; margin:0;
}
#lists :hover div dd a {display:block; text-decoration:none; font-weight:normal; font-size:12px; color:#000; text-indent:10px; line-height:15px;}
#lists :hover div dd a:hover {text-decoration:underline;}#lists .clear {clear:both;}
</style>
<body>
<div style="float:left; width:200px;">
<ul id="lists">
<li>a href="#" class="tl" >A</a>
<div >
<dl>
<dd><a href="#">Alabama</a></dd>
<dd><a href="#">Alaska</a></dd>
</dl>
<dl>
<dd><a href="#">Delaware</a></dd>
<dd><a href="#">Florida</a></dd>
</dl>
<dl>
<dd><a href="#">Nebraska</a></dd>
<dd><a href="#">Nevada</a></dd>
</dl>
</div></li>
</div>
</body>
</html>
怎么让他能在IE6下显示 隐藏的呢,大家帮帮忙! 谢谢了!
但是我很菜 ,不知道怎么改啊?
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style>
*{
margin:0;
padding:0;
}
div{
width:760px;
height:30px;
margin:0px auto;
font-size:12px;
border:#CCCCCC dashed 1px;
}
ul {
list-style:none;
margin:0px;
padding:0px;
}
li {
float:left;
height:30px;
width:190px;
background:#000;
font-size:12px;
line-height:30px;
}
li a {
display:block;
text-align:center;
height:30px;
width:190px;
position:relative;
color:#fff;
text-decoration:none;
}
li dl {
text-align:center;
display:none;
left:0px;
width:190px;
}
li dl dd{
text-align:center;
color:#fff;
margin:0px;
padding:0px;
}
li dl dd a{
display:block;
color:#fff;
text-decoration:none;
}
li dl dd a:hover{
display:block;
background:#FFF;
text-decoration:none;
}
li a:hover {width:189px;color:#fff;}
li a:hover dl{
display:block;
width:190px;
height:30px;
background:#c00;
position:absolute;
color:#fff;
top:30px;
left:0px;
}
li a:hover dl dd{
display:block;
color:#fff;
}
li a:hover dl dd a:hover{
display:block;
color:#fff;
}
</style>
</head>
<body>
<div>
<ul>
<li><a href="#">home
<dl>
<dd><a href="#">about us</a>
</dd>
</dl>
</a>
</li>
<li><a href="#">news
<dl>
<dd><a href="#">hot news</a>
</dd>
</dl>
</a>
</li>
<li><a href="#">produts
<dl>
<dd><a href="#">new produts</a>
</dd>
</dl>
</a>
</li>
<li><a href="#">book
<dl>
<dd><a href="#">new book</a>
</dd>
</dl>
</a>
</li>
</ul>
</div>
</body>
</html>