靠边的隐藏菜单代码
<p><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a target=_blank href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" target=_blank>http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>"><br /><html xmlns="<a target=_blank href="http://www.w3.org/1999/xhtml" target=_blank>http://www.w3.org/1999/xhtml</a>"><br /><head><br /><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><br /><title>靠边的隐藏菜单代码</title><br /></head><br /><style type="text/css"><br /> body {<br /> background: #fff;<br /> font-family: "Lucida Grande", Helvetica, Arial, sans-serif;<br /> font-size: 12px;<br />}</p><p>.menu {position:absolute; z-index:100; margin-top:20px;}</p><p>.menu ul {padding:0; margin:0; list-style-type: none; height:170px;}</p><p>.menu ul li {width:35px; text-align:left;}<br />* html .menu ul li {width:235px; margin-left:-16px; mar\gin-left:0;}</p><p>.menu ul li a, .menu ul li a:visited {display:block; text-decoration:none; width:15px; padding:10px; background:transparent url(tab1.gif) top right; height:80px; text-align:center; border-left:1px solid #000;}<br />* html .menu ul li a, * html .menu ul li a:visited {width:35px; height:100px; w\idth:15px; he\ight:80px;}</p><p>table {margin:0; padding:0; border:0; border-collapse:collapse;font-size:1em;}</p><p>.menu ul li ul {visibility:hidden; position:absolute; width:190px; top:0; left:0;}</p><p>.menu ul li:hover {position:relative;}<br />.menu ul li:hover a {padding-left:200px;}</p><p>.menu ul li a:hover {padding-left:201px; position:relative; z-index:200; border-left:0;}</p><p>.menu ul li:hover ul,<br />.menu ul li a:hover ul {visibility:visible; z-index:300;}</p><p>.menu ul li:hover ul li a,<br />.menu ul li a:hover ul li a {display:block; background:#d8e2e2 url(fade.gif); color:#888; text-align:left; height:auto; padding:5px; border:1px solid #000; border-width:1px 1px 0 1px; width:190px; w\idth:180px;}</p><p>.menu ul li:hover ul li a.last,<br />.menu ul li a:hover ul li a.last {border-bottom:1px solid #000;}</p><p>.menu ul li:hover ul li a:hover,<br />.menu ul li a:hover ul li a:hover {background:#e8f2f2; color:#000;}</p><p>.some_text {padding:0 20px 0 50px;}<br /></style><br /><body></p><p><div class="menu"></p><p><ul><br /> <li><a href="../menu/index.html">D E M O S<!--><!--></a><!--<!--><br /> <table><tr><td><br /> <ul><br /> <li><a href="../menu/zero_dollars.html" title="The zero dollar ads page">zero dollars advertising page</a></li><br /> <li><a href="../menu/embed.html" title="Wrapping text around images">wrapping text around images</a></li><br /> <li><a href="../menu/form.html" title="Styling forms">styled form</a></li><br /> <li><a href="../menu/nodots.html" title="Removing active/focus borders">active focus</a></li><br /> <li><a href="../menu/shadow_boxing.html" title="Multi-position drop shadow">shadow boxing</a></li><br /> <li><a href="../menu/old_master.html" title="Image Map for detailed information">image map for detailed information</a></li><br /> <li><a href="../menu/bodies.html" title="fun with background images">fun with background images</a></li><br /> <li><a href="../menu/fade_scroll.html" title="fade-out scrolling">fade scrolling</a></li><br /> <li><a class="last" href="../menu/em_images.html" title="em size images compared">em image sizes compared</a></li><br /> </ul><br /> </td></tr></table><br /> <!--></a><!--><br /> </li><br /> <li><a href="index.html">B O X E S<!--><!--></a><!--<!--><br /> <table><tr><td><br /> <ul><br /> <li><a href="spies.html" title="a coded list of spies">a coded list of spies</a></li><br /> <li><a href="vertical.html" title="a horizontal vertical menu">vertical menu</a></li><br /> <li><a href="expand.html" title="an enlarging unordered list">enlarging unordered list</a></li><br /> <li><a href="enlarge.html" title="an unordered list with link images">link images</a></li><br /> <li><a href="cross.html" title="non-rectangular links">non-rectangular</a></li><br /> <li><a href="jigsaw.html" title="jigsaw links">jigsaw links</a></li><br /> <li><a class="last" href="circles.html" title="circular links">circular links</a></li><br /> </ul><br /> </td></tr></table><br /> <!--></a><!--><br /> </li><br /></ul></div><br /></body><br /></html><br /></p><p>［此帖子已被 灰儿 在 2007-12-27 15:54:11 编辑过］
页:
[1]