<!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> <style type="text/css"> /*基本设置*/ a{ text-decoration:none; font-size:36px; display:block; color:#000;} a:link{ color:#000;} a:visited{ color:#000;} a:hover{ color:#C00;} a:active{ color:#000;} li{ list-style:none;} /*一级菜单设置*/ #demo li{ float:left; margin-right:50px;} /*二级菜单设置*/ #demo li ul{ display:none;/*初始状态：不可见*/ position:absolute; padding:0;} #demo li ul li{ float:none;} /*鼠标滑过一级菜单，显示对应的二级菜单*/ #demo li:hover ul{ display:block;} </style> </head> <body> <ul id="demo"> <li> <a href="#" class="one">网络1603</a> <ul> <li><a href="#" class="two">第四组</a></li> <li><a href="#" class="two">第五组</a></li> <li><a href="#" class="two">第六组</a></li> </ul> </li> <li> <a href="#" class="one">网络1604</a> <ul> <li><a href="#" class="two">第一组</a></li> <li><a href="#" class="two">第二组</a></li> <li><a href="#" class="two">第三组</a></li> </ul> </li> </ul> </body> </html>