<div class="codetitle"> <span><a style="CURSOR: pointer" data="98893" class="copybut" id="copybut98893" onclick="doCopy('code98893')"><u>复制代</u></a></span> 代码如下:</div> <div class="codebody" id="code98893"> <br><!DOCTYPEhtml PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <BR><html> <BR><フラッド> <BR><metahttp-equiv="content-type"content="text/html;charset=utf-8"> <br><title>折れる二級菜单</title> <br><styletype="text/css"> <br><!-- <BR>body{ <BR>background-color:#ffdee0; <BR>} <BR>#navigation { <BR>width:200px; <BR>フォントファミリー:Arial; <BR>} <BR>#ナビゲーション > ul {<br>リストスタイルタイプ:なし; <br>マージン:0px; <br>パディング:0px; <br>} <br>#ナビゲーション > ul >li { <br>border-bottom:1pxsolid #ED9F9F; <br>} <br>#ナビゲーション >ウル>リ> a{<br>表示:ブロック; <br>パディング:5px5px 5px 0.5em; <br>テキスト装飾:なし; <br>border-left:12pxsolid #711515; <br>border-right:1pxsolid #711515; <br>} <br>#ナビゲーション >ウル>リ> a:link、#navigation >ul >li > a:visited{ <br>背景色:#c11136; <br>カラー:#FFFFFF; <br>} <br>#ナビゲーション >ウル>リ> a:hover{ <br>背景色:#990020; <br>色:#ffff00; <br>} <br>.txt{ <br>背景色:#c11136; <br>カラー:#FFFFFF; <br>パディング:5px5px 5px 0.5em; <br>テキスト装飾:なし; <br>border-left:12pxsolid #711515; <br>border-right:1pxsolid #711515; <br>} <br><br>/* 子菜单のCSS样式 */ <br>#navigation ul li ul{ <br>list-style-type:none; <br>マージン:0px; <br>パディング:0px0px 0px 0px; <br>} <br>#navigation ul li ulli{ <br>border-top:1pxsolid #ED9F9F; <br>} <br>#navigation ul li ulli a{ <br>display:block; <br>パディング:3px3px 3px 0.5em; <br>テキスト装飾:なし; <br>border-left:28pxsolid #a71f1f; <br>border-right:1pxsolid #711515; <br>} <br>#navigation ul li ulli a:link, #navigationul li ul lia:visited{ <br>background-color:#e85070; <br>カラー:#FFFFFF; <br>} <br>#navigation ul li ulli a:hover{ <br>background-color:#c2425d; <br>色:#ffff00; <br>} <br>#navigation ul li ul.myHide{ /* 隐藏子菜单 */ <br>display:none; <br>} <br>#navigation ul li ul.myShow{ /* 显示子菜单 */ <br>display:block; <br>} <br>--> <br></style> <br><script language="javascript"> <br>window.onload=function(){ <br>varlistUL=document.getElementById("listUL"); <br>varolist=listUL.childNodes; <br>varoa=0; <br>for(var i = 0; i <olist.length i>if(olist[i].tagName=="LI"&&olist[i].getElementsByTagName("ul")[0] ){ <br>oa=olist[i]; <br>oa.onclick=change; <br>} <br><br>} <br>functionchange(){ <br>varos=this.getElementsByTagName("ul")[0]; <br>if(os.className=="myHide") <br>os.className="myShow"; <br>else <br>os.className="myHide"; <br>} <br>} <br></script> <br></hrad> <br> <br><divid="ナビゲーション"> <br><ulid="listUL"> <br><li> <br><divclass="txt">ホーム</div> <br></li> <br> </li> <li> <br><divclass="txt">ニュース</div> <br><ulclass="myHide"> <br><li><ahref="#">最新ニュース</a></li> <br><li><ahref="#">すべてのニュース</a></li> <br> <br></li> <br> </li> <li> <br><divclass="txt">スポーツ</div> <br><ulclass="myHide"> <br><li><ahref="#">最新ニュース</a></li> <br><li><ahref="#">すべてのニュース</a></li> <br> <br></li> <br> </li> <li> <br><divclass="txt">天気</div> <br><ulclass="myHide"> <br><li><ahref="#">最新ニュース</a></li> <br><li><ahref="#">すべてのニュース</a></li> <br> <br></li> <br> <br> </li></olist.length> </div> <br></body> <br></html> <br>