<script type="text/javascript"> </script> <script type="text/javascript"><!-- startList = function() { if (document.all&&document.getElementById) { navRoot = document.getElementById("menu"); for (i=0; i<navRoot.childNodes.length; i++) { node = navRoot.childNodes[i]; if (node.nodeName=="LI") { node.οnmοuseοver=function() { this.className+=" over"; } node.οnmοuseοut=function() { this.className=this.className.replace(" over", ""); } } } } } window.οnlοad=startList; // --></script> <mce:style type="text/css"><!-- #setdiv { width:430px; height:20px; float:left; background:#999999; } #menu { list-style-type:none; margin:0 auto; float:left; width:430px; } #menu li { float:left; margin-left:3px; margin-top:5px; margin-bottom:5px; } #menu li a { text-decoration:none; background:#FF6600; padding:6px 20px 6px 8px; color:#FFFFFF; font-family:Arial; font-size:16px; } #menu li a:hover { color:#FFFFFF; background:#999900; } #menu li ul { float:left; width:200px; height:auto; display:none; position:absolute; margin-left:-7.2em; margin-top:2em; padding-left:-9em; background:#9966FF; } #menu li ul li { width:200px; height:20px; line-height:20px; text-align:center; margin:0 auto; font-size:13px; font-family:Arial; border-top:1px #FFFFFF solid; } #menu li ul li a { width:200px; color:#FFFFFF; background:#9966FF; padding-right:150px; padding-left:-9em; border-top:1px solid #FFFFFF; padding-bottom:5em; margin-left:0; } #menu li ul li a:hover { padding-left:-9em; } #menu li:hover ul,#menu li.over ul { display:block; } --></mce:style><style type="text/css" mce_bogus="1">#setdiv { width:430px; height:20px; float:left; background:#999999; } #menu { list-style-type:none; margin:0 auto; float:left; width:430px; } #menu li { float:left; margin-left:3px; margin-top:5px; margin-bottom:5px; } #menu li a { text-decoration:none; background:#FF6600; padding:6px 20px 6px 8px; color:#FFFFFF; font-family:Arial; font-size:16px; } #menu li a:hover { color:#FFFFFF; background:#999900; } #menu li ul { float:left; width:200px; height:auto; display:none; position:absolute; margin-left:-7.2em; margin-top:2em; padding-left:-9em; background:#9966FF; } #menu li ul li { width:200px; height:20px; line-height:20px; text-align:center; margin:0 auto; font-size:13px; font-family:Arial; border-top:1px #FFFFFF solid; } #menu li ul li a { width:200px; color:#FFFFFF; background:#9966FF; padding-right:150px; padding-left:-9em; border-top:1px solid #FFFFFF; padding-bottom:5em; margin-left:0; } #menu li ul li a:hover { padding-left:-9em; } #menu li:hover ul,#menu li.over ul { display:block; }</style> <div id="setdiv"> <ul id="menu"> <li><a href="#" mce_href="#">HOME</a></li> <li><a href="#" mce_href="#">SUB_A</a> <ul> <li><a href="#" mce_href="#">sub_A_a</a></li> <li><a href="#" mce_href="#">sub_A_b</a></li> <li><a href="#" mce_href="#">sub_A_c</a></li> <li><a href="#" mce_href="#">sub_A_d</a></li> <li><a href="#" mce_href="#">sub_A_e</a></li> </ul> </li> <li><a href="#" mce_href="#">SUB_B</a></li> <li><a href="#" mce_href="#">SUB_C</a> <ul> <li><a href="#" mce_href="#">sub_B_a</a></li> <li><a href="#" mce_href="#">sub_B_b</a></li> <li><a href="#" mce_href="#">sub_B_c</a></li> </ul> </li> <li><a href="#" mce_href="#">SUB_D</a></li> </ul> </div> 提示:您可以先修改部分代码再运行 运行后的尺寸偏大,不知道是哪里出的问题,但是我在自己机器上运行正常,我想可能是【运行代码模块】那块还有点问题,懒得弄,下次有时间再修改吧