正在学CSS,自写了段代码,想实现坚排二级菜单的伸缩,结果发现只能收缩隐藏,不能打开,请高手指点。HTML代码<!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>
 <link href="css/lists.css" rel="stylesheet" type="text/css"/><script type="text/javascript">
<!--
function clickshow(t)
{
if (document.getElementById(t).style.display='none')
{
getElementById(t).style.display=='bolck';
}
else
{
getElementById(t).style.display=='none';
}
}
-->
</script>
 
 
 
 
</head> <body> 
<div id="container">
  <dl>
   <dt onclick="clickshow('menu1')"><a href="#">Menu 1 <a> </dt>
    <dd>
     <ul>
     <li><a href="#">Drink Menu</a></li>
     <li><a href="#">Beer</a></li>
<li><a href="#">Spiirts</a></li>
<li><a href="#">Cola</a></li>
<li><a href="#">Lemonade</a></li>
<li><a href="#">Tea</a></li>
<li><a href="#">Coffee</a></li>
     </ul>
    </dd>   <dt onclick="clickshow('menu2')"><a href="#">Menu 2 <a></dt>   
    <dd>
     <ul id="menu2">
     <li><a href="#">Drink Menu</a></li>
     <li><a href="#">Beer</a></li>
<li><a href="#">Spiirts</a></li>
<li><a href="#">Cola</a></li>
<li><a href="#">Lemonade</a></li>
<li><a href="#">Tea</a></li>
<li><a href="#">Coffee</a></li>
     </ul>
    </dd>
   </dl>
</div>
</body> 
</html>
CSS代码  body { 
    margin: 10px; 
    background-color:#CCC; 
  } 
/* Container for all page content */ 
#container { 
border:1px solid #000; 
    background-color:#FFF;
  }dl{
width:160px;
margin:0;
padding:2px;
border:1px solid #000;
font: bold 12px 'Lucida Grande',Verdana,sans-serif; 
}dl a:link, dl a:visited, dl a:hover, dl a:active { 
  display:block; 
  padding: 2px 10px; 
  text-decoration:none; 
}dl a:hover{
color:#FFF;
background:#000;
}dt{
background-color:#DDDDDD;
padding:2px;
border-style:solid;
border-width:1ps;
border-color:#FFF #AAA #666 #FFF;
width:auto;
}dd{
margin:0;
}ul {
margin:5px 0 5px 0;
    padding:0;
    list-style-type:none;
}ul a:link, ul a:visited, ul a:hover, ul a:active { 
  display:block; 
  padding: 2px 10px; 
  text-decoration:none; 
}ul a:hover{
color:#FFF;
background:#000;
}li{
background:#ddd;
margin:0;
padding:2px;
border-style:solid;
border-width:1px;
border-color:#FFF #AAA #666 #FFF;
)