清华大佬耗费三个月吐血整理的几百G的资源,免费分享!....>>>
<!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" /> <!--[if IE]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> <!--[if lt IE 7]> <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta3)/IE7.js"></script> <link href="CSS/ie6_hacks.css" rel="stylesheet" type="text/css" /> <style> ul, li, a, img, div, dd, dl, dt {behavior: url()} </style> <![endif]--> <style type="text/css" media="screen"> /* 三级导航实例 */ body { font-family: "Microsoft YaHei"; font-size: 12px; line-height: 1.5; line-height: 100%; text-align: center; margin: 0px; padding: 0px; } img { border-style: none; } a { color: #000; text-decoration: none; } a:hover { color: #FFF; } #menu { width: 100px; border: 1px solid #CCC; border-bottom:none;float:left;} /*1级*/ #menu ul { list-style: none; margin: 0px; padding: 0px; } #menu ul li { background: #eee; height:26px; line-height: 26px; position:relative; } /* #menu ul li ul { display:block; position: absolute; left: 100px;top: 0px; width:100px;} */ /*2级*/ div ul li ul { display:none; position: absolute; left: 100px;top: 0px; width:100px;margin-left:0px} div ul li ul li{position:relative;} div ul li:hover ul { display:block;} /*3级*/ #menu ul li ul li ul{ display:none; position: absolute; left: 100px; top: 0px; width:100px;margin-left:0px} #menu ul li ul li ul li{position:relative;} #menu ul li ul li:hover ul{display:block;} #main { width:70%;background-color:red;height:100px;float:left;} </style> </head></p> <p><body> <div id="menu"> <ul> <li> <a href="#">首页</a> </li> <li> <a href="#">网页版式布局</a> <ul> <li> <a href="#">自适应宽度</a> <ul> <li><a href="#">111111</a></li> <li><a href="#">222222</a></li> </ul> </li> <li> <a href="#">固定宽度</a> </li> </ul> </li> <li> <a href="#">div+css教程</a> <ul> <li> <a href="#">新手入门</a> </li> <li> <a href="#">视频教程</a> </li> <li> <a href="#">常见问题</a> </li> </ul> </li> <li> <a href="#">div+css实例</a> </li> <li> <a href="#">常用代码</a> </li> <li> <a href="#">站长杂谈</a> </li> <li> <a href="#">技术文档</a> </li> <li> <a href="#">资源下载</a> </li> <li> <a href="#">图片素材</a> </li> </ul> </div> <div id="main">ddd </div> </body> </html>