提示:您可以先修改部分代碼再運行
<!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=GB2312" /> <title>純CSS菜單</title> <style type="text/css"> * { font-family:"宋體"; margin:0; padding:0; } body { padding:15px; } .nav li li a { display:inline-block; } .nav li li a { display:block; } .nav ul { list-style-type:none; margin:0; padding:0; } .nav ul li { float:left; line-height:24px; display:block; border-bottom:dashed #ccc 1px; font-size:0; padding:0; margin:0; width:120px; } .nav ul li a { display:block; width:120px; height:24px; font-size:12px; text-align:center; color:#555; text-decoration:none; background:#f7f7f7; } .nav ul table { width:100%; border-collapse:collapse; border:0; padding:0; margin:0; } .nav ul li ul { display:none; } .nav ul li:hover, .nav ul li a:hover, .nav ul li a:active { color:red; background-color:#f1f1f1; } .nav ul li:hover ul, .nav ul li a:hover ul, .nav ul li a:active ul { display:block; width:100%; } .nav ul ul li { display:block; width:100%; border:none; } .nav ul ul li a { display:block; color:blue; border:none; } </style> </head> <body> <div class="nav"> <ul> <li>首頁 <table cellpadding="0" cellspacing="0"> <tr> <td><ul> <li>最新更新</li> <li>下載排行</li> </ul></td> </tr> </table> </li> <li>ASP <table cellpadding="0" cellspacing="0"> <tr> <td><ul> <li>企業整站</li> <li>圖片相簿</li> <li>社區程式</li> </ul></td> </tr> </table> </li> <li>PHP <table cellpadding="0" cellspacing="0"> <tr> <td><ul> <li>部落格微博</li> <li>論壇社區</li> </ul></td> </tr> </table> </li> <li>JSP <table cellpadding="0" cellspacing="0"> <tr> <td><ul> <li>企業</li> <li>新聞系統</li> <li>留言</li> </ul></td> </tr> </table> </li> <li>VC++ <table cellpadding="0" cellspacing="0"> <tr> <td><ul> <li>資料庫</li> <li>介面</li> <li>加密</li> </ul></td> </tr> </table> </li> <li>DELPHI <table cellpadding="0" cellspacing="0"> <tr> <td><ul> <li>系統相關</li> <li>演算法</li> <li>資料庫</li> </ul></td> </tr> </table> </li> </ul> </div> </body> </html> </td> </tr></table>
提示:您可以先修改部分代碼再運行