Revision: 19258
Updated Code
at October 19, 2009 22:18 by xxc
Updated Code
<style> #mainNav li{display:block;position:relative;height:31px;overflow:hidden;float:right;} #it5 {width:97px;} #it4 {width:94px;} #it3 {width:95px;} #it2 {width:101px;} #it1 {width:106px;} .NavT {display:block;height:38px;text-indent:-9999px;} #it5 .NavT {background:url(/img/bg-mainNav-item.png) 0 0 no-repeat; width:97px;} #it4 .NavT {background:url(/img/bg-mainNav-item.png) -97px 0 no-repeat; width:94px;} #it3 .NavT {background:url(/img/bg-mainNav-item.png) -191px 0 no-repeat; width:95px;} #it2 .NavT {background:url(/img/bg-mainNav-item.png) -286px 0 no-repeat; width:101px;} #it1 .NavT {background:url(/img/bg-mainNav-item.png) -387px 0 no-repeat; width:106px;} #it5 .NavT:hover {background:url(/img/bg-mainNav-item.png) 0 -31px no-repeat;} #it4 .NavT:hover {background:url(/img/bg-mainNav-item.png) -97px -31px no-repeat;} #it3 .NavT:hover {background:url(/img/bg-mainNav-item.png) -191px -31px no-repeat;} #it2 .NavT:hover {background:url(/img/bg-mainNav-item.png) -286px -31px no-repeat;} #it1 .NavT:hover {background:url(/img/bg-mainNav-item.png) -387px -31px no-repeat;} ul#mainNav li p.subNav {position:absolute;top:38px;right:0px; height:110px;;background:url(/img/-bg-subNav.png) repeat-x; text-align:center; width:100%;border-top:1px #ccc solid;} ul#mainNav li p.subNav a {display:block; color:#4b4b4b; background:url(/img/bg-mainNav-subNav-a.png) repeat-y; padding-top:4px;font-weight:bold; text-decoration:none;border-left:1px #ccc solid;border-right:1px #ccc solid;border-bottom:1px #ccc solid;height:22px;} ul#mainNav li p.subNav a:hover {color:#0583c9;} </style> <ul id="mainNav"> <li id="it1"><a class="NavT" href="#">AAA</a><p class="subNav"><a href="#">A11</a><a href="#">A22</a></p></li> <li id="it2"><a class="NavT" href="#">BBB</a><p class="subNav"><a href="#">B11</a><a href="#">B22</a></p></li> <li id="it3"><a class="NavT" href="#">CCC</a><p class="subNav"><a href="#">C11</a><a href="#">C22</a></p></li> <li id="it4"><a class="NavT" href="#">DDD</a><p class="subNav"><a href="#">D11</a><a href="#">D22</a></p></li> <li id="it5"><a class="NavT" href="#">EEE</a><p class="subNav"><a href="#">E11</a><a href="#">E22</a></p></li> </ul>
Revision: 19257
Updated Code
at October 19, 2009 22:17 by xxc
Updated Code
<style> #mainNav li{display:block;position:relative;height:31px;overflow:hidden;float:right;} #it5 {width:97px;} /*ä¸æ–‡æ¸¬è©¦è¨±åŠŸè“‹*/ #it4 {width:94px;} #it3 {width:95px;} #it2 {width:101px;} #it1 {width:106px;} .NavT {display:block;height:38px;text-indent:-9999px;} #it5 .NavT {background:url(/img/bg-mainNav-item.png) 0 0 no-repeat; width:97px;} #it4 .NavT {background:url(/img/bg-mainNav-item.png) -97px 0 no-repeat; width:94px;} #it3 .NavT {background:url(/img/bg-mainNav-item.png) -191px 0 no-repeat; width:95px;} #it2 .NavT {background:url(/img/bg-mainNav-item.png) -286px 0 no-repeat; width:101px;} #it1 .NavT {background:url(/img/bg-mainNav-item.png) -387px 0 no-repeat; width:106px;} #it5 .NavT:hover {background:url(/img/bg-mainNav-item.png) 0 -31px no-repeat;} #it4 .NavT:hover {background:url(/img/bg-mainNav-item.png) -97px -31px no-repeat;} #it3 .NavT:hover {background:url(/img/bg-mainNav-item.png) -191px -31px no-repeat;} #it2 .NavT:hover {background:url(/img/bg-mainNav-item.png) -286px -31px no-repeat;} #it1 .NavT:hover {background:url(/img/bg-mainNav-item.png) -387px -31px no-repeat;} ul#mainNav li p.subNav {position:absolute;top:38px;right:0px; height:110px;;background:url(/img/-bg-subNav.png) repeat-x; text-align:center; width:100%;border-top:1px #ccc solid;} ul#mainNav li p.subNav a {display:block; color:#4b4b4b; background:url(/img/bg-mainNav-subNav-a.png) repeat-y; padding-top:4px;font-weight:bold; text-decoration:none;border-left:1px #ccc solid;border-right:1px #ccc solid;border-bottom:1px #ccc solid;height:22px;} ul#mainNav li p.subNav a:hover {color:#0583c9;} </style> <ul id="mainNav"> <li id="it1"><a class="NavT" href="#">AAA</a><p class="subNav"><a href="#">A11</a><a href="#">A22</a></p></li> <li id="it2"><a class="NavT" href="#">BBB</a><p class="subNav"><a href="#">B11</a><a href="#">B22</a></p></li> <li id="it3"><a class="NavT" href="#">CCC</a><p class="subNav"><a href="#">C11</a><a href="#">C22</a></p></li> <li id="it4"><a class="NavT" href="#">DDD</a><p class="subNav"><a href="#">D11</a><a href="#">D22</a></p></li> <li id="it5"><a class="NavT" href="#">EEE</a><p class="subNav"><a href="#">E11</a><a href="#">E22</a></p></li> </ul>
Revision: 19256
Updated Code
at October 19, 2009 22:13 by xxc
Updated Code
<style> #mainNav li{display:block;position:relative;height:31px;overflow:hidden;float:right;} #it5 {width:97px;} #it4 {width:94px;} #it3 {width:95px;} #it2 {width:101px;} #it1 {width:106px;} .NavT {display:block;height:38px;text-indent:-9999px;} #it5 .NavT {background:url(/img/bg-mainNav-item.png) 0 0 no-repeat; width:97px;} #it4 .NavT {background:url(/img/bg-mainNav-item.png) -97px 0 no-repeat; width:94px;} #it3 .NavT {background:url(/img/bg-mainNav-item.png) -191px 0 no-repeat; width:95px;} #it2 .NavT {background:url(/img/bg-mainNav-item.png) -286px 0 no-repeat; width:101px;} #it1 .NavT {background:url(/img/bg-mainNav-item.png) -387px 0 no-repeat; width:106px;} #it5 .NavT:hover {background:url(/img/bg-mainNav-item.png) 0 -31px no-repeat;} #it4 .NavT:hover {background:url(/img/bg-mainNav-item.png) -97px -31px no-repeat;} #it3 .NavT:hover {background:url(/img/bg-mainNav-item.png) -191px -31px no-repeat;} #it2 .NavT:hover {background:url(/img/bg-mainNav-item.png) -286px -31px no-repeat;} #it1 .NavT:hover {background:url(/img/bg-mainNav-item.png) -387px -31px no-repeat;} ul#mainNav li p.subNav {position:absolute;top:38px;right:0px; height:110px;;background:url(/img/-bg-subNav.png) repeat-x; text-align:center; width:100%;border-top:1px #ccc solid;} ul#mainNav li p.subNav a {display:block; color:#4b4b4b; background:url(/img/bg-mainNav-subNav-a.png) repeat-y; padding-top:4px;font-weight:bold; text-decoration:none;border-left:1px #ccc solid;border-right:1px #ccc solid;border-bottom:1px #ccc solid;height:22px;} ul#mainNav li p.subNav a:hover {color:#0583c9;} </style> <ul id="mainNav"> <li id="it1"><a class="NavT" href="#">AAA</a><p class="subNav"><a href="#">A11</a><a href="#">A22</a></p></li> <li id="it2"><a class="NavT" href="#">BBB</a><p class="subNav"><a href="#">B11</a><a href="#">B22</a></p></li> <li id="it3"><a class="NavT" href="#">CCC</a><p class="subNav"><a href="#">C11</a><a href="#">C22</a></p></li> <li id="it4"><a class="NavT" href="#">DDD</a><p class="subNav"><a href="#">D11</a><a href="#">D22</a></p></li> <li id="it5"><a class="NavT" href="#">EEE</a><p class="subNav"><a href="#">E11</a><a href="#">E22</a></p></li> </ul>
Revision: 19255
Initial Code
Initial URL
Initial Description
Initial Title
Initial Tags
Initial Language
at October 19, 2009 22:05 by xxc
Initial Code
<ul id="mainNav"> <li id="it1"><a class="subNav" href="#">AAA</a><p class="subNav"><a href="#">A11</a><a href="#">A22</a></p></li> <li id="it2"><a class="subNav" href="#">BBB</a><p class="subNav"><a href="#">B11</a><a href="#">B22</a></p></li> <li id="it3"><a class="subNav" href="#">CCC</a><p class="subNav"><a href="#">C11</a><a href="#">C22</a></p></li> <li id="it4"><a class="subNav" href="#">DDD</a><p class="subNav"><a href="#">D11</a><a href="#">D22</a></p></li> <li id="it5"><a class="subNav" href="#">EEE</a><p class="subNav"><a href="#">E11</a><a href="#">E22</a></p></li> </ul>
Initial URL
Initial Description
Initial Title
main navigation (2-level-depth)
Initial Tags
navigation
Initial Language
HTML