树形菜单

<style type="text/css">
body{font-size:13px;
     line-height:20px;
     }
a{font-size: 13px;
  color: #000000;
  text-decoration: none;
  }
a:hover{font-size:13px;
       color: #ff0000;
       }
img {
    vertical-align: middle;
    border:0;
}
.no_circle{list-style-type:none;  /*设置列表项标志的类型为无*/
   display:none;
    }
</style>
<script  type="text/javascript">
function show(){
if(document.getElementById("art").style.display=='block'){
    document.getElementById("art").style.display='none';  //触动的ul如果处于显示状态,即隐藏
 }
else{
    document.getElementById("art").style.display='block';  //触动的ul如果处于隐藏状态,即显示
   }
}
</script>
</head>

<body>
<b><img src="images/fold.gif">树形菜单:</b>  
<ul><a href="javascript:onclick=show() "><img src="images/fclose.gif">文学艺术</a></ul>
<ul id="art" class="no_circle">
<li><img src="images/doc.gif" >先锋写作</li>
           <li> <img src="images/doc.gif" >小说散文</li>
            <li><img src="images/doc.gif" >诗风词韵</li>
            </ul>
</body>

 

posted @ 2013-11-16 13:15  914556495  阅读(193)  评论(0编辑  收藏  举报