Kilometro6
Tabs menu
Tabs menu
Para obtener cada menu es necesario serguir este procedimiento. Cada menú tiene 2 códigos, uno es el HTML del menu y el otro es el CSS del menu. El código CSS del menu lo tienen que pegar en "Css-Code sin Style Tags" y el código HTML del menú lo pegan en "Texto por encima de la página". Este se encuentra el final de la página ya que es igual en todos los menús.Menu 1:
#tabs { float:left; width:100%; font-size:93%; line-height:normal; } #tabs ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabs li { display:inline; margin:0; padding:0; } #tabs a { float:left; background:url(https://img.webme.com/pic/k/kilometro6-pruebas/tableft1.gif) no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabs a span { float:left; display:block; background:url(https://img.webme.com/pic/k/kilometro6-pruebas/tabright1.gif) no-repeat right top; padding:5px 15px 4px 6px; color:#627EB7; } /* Commented Backslash Hack hides rule from IE5-Mac */ #tabs a span {float:none;} /* End IE5-Mac hack */ #tabs a:hover span { color:#627EB7; } #tabs a:hover { background-position:0% -42px; } #tabs a:hover span { background-position:100% -42px; }
Menu 2:
#tabs { float:left; width:100%; font-size:93%; line-height:normal; } #tabs ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabs li { display:inline; margin:0; padding:0; } #tabs a { float:left; background:url(https://img.webme.com/pic/k/kilometro6-pruebas/tableft2.gif) no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabs a span { float:left; display:block; background:url(https://img.webme.com/pic/k/kilometro6-pruebas/tabright2.gif) no-repeat right top; padding:5px 15px 4px 6px; color:#84776B; } /* Commented Backslash Hack hides rule from IE5-Mac */ #tabs a span {float:none;} /* End IE5-Mac hack */ #tabs a:hover span { color:#74675B; } #tabs a:hover { background-position:0% -42px; } #tabs a:hover span { background-position:100% -42px; }
Menu 3:
#tabs { float:left; width:100%; font-size:93%; line-height:normal; } #tabs ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabs li { display:inline; margin:0; padding:0; } #tabs a { float:left; background:url(https://img.webme.com/pic/k/kilometro6-pruebas/tableft4.gif) no-repeat left top; margin:0; padding:0 0 0 7px; text-decoration:none; } #tabs a span { float:left; display:block; background:url(https://img.webme.com/pic/k/kilometro6-pruebas/tabright4.gif) no-repeat right top; padding:5px 15px 4px 6px; color:#6B78A9; } /* Commented Backslash Hack hides rule from IE5-Mac */ #tabs a span {float:none;} /* End IE5-Mac hack */ #tabs a:hover span { color:#6B78A9; } #tabs a:hover { background-position:0% -42px; } #tabs a:hover span { background-position:100% -42px; }
Menu 4:
#tabs { float:left; width:100%; font-size:93%; line-height:normal; } #tabs ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabs li { display:inline; margin:0; padding:0; } #tabs a { float:left; background:url(https://img.webme.com/pic/k/kilometro6-pruebas/tableft5.gif) no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabs a span { float:left; display:block; background:url(https://img.webme.com/pic/k/kilometro6-pruebas/tabright5.gif) no-repeat right top; padding:5px 15px 4px 6px; color:#FFF; } /* Commented Backslash Hack hides rule from IE5-Mac */ #tabs a span {float:none;} /* End IE5-Mac hack */ #tabs a:hover span { color:#FFF; } #tabs a:hover { background-position:0% -42px; } #tabs a:hover span { background-position:100% -42px; }
Menu 5:
#tabs { float:left; width:100%; font-size:93%; line-height:normal; } #tabs ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabs li { display:inline; margin:0; padding:0; } #tabs a { float:left; background:url(https://img.webme.com/pic/k/kilometro6-pruebas/tableft6.gif) no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabs a span { float:left; display:block; background:url(https://img.webme.com/pic/k/kilometro6-pruebas/tabright6.gif) no-repeat right top; padding:5px 15px 4px 6px; color:#FFF; } /* Commented Backslash Hack hides rule from IE5-Mac */ #tabs a span {float:none;} /* End IE5-Mac hack */ #tabs a:hover span { color:#FFF; } #tabs a:hover { background-position:0% -42px; } #tabs a:hover span { background-position:100% -42px; }
Menu 6:
#tabs { float:left; width:100%; font-size:93%; line-height:normal; } #tabs ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabs li { display:inline; margin:0; padding:0; } #tabs a { float:left; background:url(https://img.webme.com/pic/k/kilometro6-pruebas/tableft7.gif) no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabs a span { float:left; display:block; background:url(https://img.webme.com/pic/k/kilometro6-pruebas/tabright7.gif) no-repeat right top; padding:5px 15px 4px 6px; color:#999; } /* Commented Backslash Hack hides rule from IE5-Mac */ #tabs a span {float:none;} /* End IE5-Mac hack */ #tabs a:hover span { color:#ECB546; } #tabs a:hover { background-position:0% -42px; } #tabs a:hover span { background-position:100% -42px; }
Menu 7:
#tabs { float:left; width:100%; font-size:93%; line-height:normal; } #tabs ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabs li { display:inline; margin:0; padding:0; } #tabs a { float:left; background:url(https://img.webme.com/pic/k/kilometro6-pruebas/tableft23.gif) no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabs a span { float:left; display:block; background:url(https://img.webme.com/pic/k/kilometro6-pruebas/tabright23.gif) no-repeat right top; padding:5px 15px 4px 6px; color:#666; } /* Commented Backslash Hack hides rule from IE5-Mac */ #tabs a span {float:none;} /* End IE5-Mac hack */ #tabs a:hover span { color:#000; } #tabs a:hover { background-position:0% -42px; } #tabs a:hover span { background-position:100% -42px; }
Menu 8:
#tabs { float:left; width:100%; font-size:93%; line-height:normal; } #tabs ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabs li { display:inline; margin:0; padding:0; } #tabs a { float:left; background:url(https://img.webme.com/pic/k/kilometro6-pruebas/tableft24.gif) no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabs a span { float:left; display:block; background:url(https://img.webme.com/pic/k/kilometro6-pruebas/tabright24.gif) no-repeat right top; padding:5px 15px 4px 6px; color:#464E42; } /* Commented Backslash Hack hides rule from IE5-Mac */ #tabs a span {float:none;} /* End IE5-Mac hack */ #tabs a:hover span { color:#FFF; } #tabs a:hover { background-position:0% -42px; } #tabs a:hover span { background-position:100% -42px; }
Código HTML:
<div id="tabs"> <ul> <li><a href="http://www.free-css.com/" _fcksavedurl="http://www.free-css.com/"><span>CSS Templates</span></a></li> <li><a href="http://www.free-css.com/" _fcksavedurl="http://www.free-css.com/"><span>CSS Layouts</span></a></li> <li><a href="http://www.free-css.com/" _fcksavedurl="http://www.free-css.com/"><span>CSS Books</span></a></li> <li><a href="http://www.free-css.com/" _fcksavedurl="http://www.free-css.com/"><span>CSS Menus</span></a></li> <li><a href="http://www.free-css.com/" _fcksavedurl="http://www.free-css.com/"><span>CSS Tutorials</span></a></li> <li><a href="http://www.free-css.com/" _fcksavedurl="http://www.free-css.com/"><span>CSS Reference</span></a></li> <li><a rel="nofollow" target="_blank" href="http://www.exploding-boy.com/" _fcksavedurl="http://www.exploding-boy.com/" title="explodingboy"><span>explodingboy</span></a></li> </ul> </div>
Cualquier pregunta puedes hacerla en nuestra Seccion de Soporte
Hoy hemos ayudado a 29 visitantes (31 clics a subpáginas) en kilometro6!