Búsqueda en el Foro:
Buscar


Autor Mensaje
Mensaje21-10-2008, 23:07 (UTC)    
Título del mensaje: [Css Codigo] Menus Horizontales con plantilla modificada
Responder citando
Miren estos son algunos menus horizontales con plantillas modificadas



Codigo pegalo por encima de la pagina

Código:
<style type="text/css">

#MainMenu
{
   height:36px;
   background: #FFFFFF url('http://www.fileden.com/files/2007/6/19/1190933/bmid_113.gif');
   margin:0;
   border:0px none;
}
#tab
{
   margin:0;
   top:0;
}
#tab ul
{
   margin:0;
   padding:0;
   list-style:none;
   float:left;
}
#tab li
{
display:inline;
   float:left;
   margin:0;
   padding:0;
}
#tab a
{
   background: url('http://www.fileden.com/files/2007/6/19/1190933/bright_113.gif') no-repeat right top;
   margin:0;
   padding:0;
   text-decoration:none;
   border:0px none;
   display:block;
   float:left
}
#tab a span
{
   display:block;
   background:url('http://www.fileden.com/files/2007/6/19/1190933/bleft_113.gif') no-repeat left top;
   font-family:Arial, Helvetica, sans-serif;
   font-size:11;
   color:#FFFFFF;
   font-weight:bold;
   line-height:36px; padding-left:22px; padding-right:22px; padding-top:0; padding-bottom:0
}
#tab a:hover, #tab li.item_active a
{
   background-position:right bottom;
   border-color:;
}
#tab a:hover span, #tab li.item_active a span
{
   background-position:left bottom;
   color:#FFFFFF;
   font-weight:bold;
   font-style:normal;
   text-decoration:none;
}
.dropmenudiv
{
   position:absolute;
   top:0;
   float:left;
   display:block;
   visibility:hidden;
   border:0px solid ;
   background: #FFFFFF url('http://www.fileden.com/files/2007/6/19/1190933/bmid_113.gif');
   color:#FFFFFF;
   z-index:100;
   text-decoration:none;
   padding:0
}
.dropmenudiv ul
{
   margin:0;
   padding:0;
   list-style:none;
}
.dropmenudiv li
{
   display:inline;
   margin:0;
   padding:0;
}
.dropmenudiv a:link, .dropmenudiv a:visited
{
   width:180px;
   margin:0;
   padding:0;
   display:block;
   border:0px solid ;
   color:#FFFFFF;
   background:url('http://www.fileden.com/files/2007/6/19/1190933/bleft_113.gif') no-repeat left top;
   font-weight:bold;
   font-style:normal;
   text-decoration:none
}
.dropmenudiv a span
{
   float:left;
   display:block;
   line-height:36px;
   background:url('http://www.fileden.com/files/2007/6/19/1190933/bright_113.gif') no-repeat right top;
   font-family:Arial, Helvetica, sans-serif;
   font-size:11;
   color:#FFFFFF; padding-left:22px; padding-right:22px; padding-top:0; padding-bottom:0
}
.dropmenudiv a span
{
   float:none;
}
.dropmenudiv a:hover
{
   border:0px solid ;
   background-position: left bottom;
   font-weight:bold;
   font-style:normal;
   text-decoration:none;
   color:#FFFFFF
}
.dropmenudiv a:hover span
{
   background-position:right bottom;
   color:#FFFFFF;
   font-weight:bold;
}




</style>






<script type="text/javascript" src="http://h1.ripway.com/kristaldunya/chromees.js"></script>
<style>
#MainMenu
{
   height:36px;
   background: #FFFFFF url("http://www.fileden.com/files/2007/6/19/1190933/bmid_113.gif");
   margin:0;
   border:0;
}
#tab
{
   margin:0;
   top:0;
}
#tab ul
{
   margin:0;
   padding:0;
   list-style:none;
   float:left;
}
#tab li
{
display:inline;
   float:left;
   margin:0;
   padding:0;
}
#tab a
{
   background: url("http://www.fileden.com/files/2007/6/19/1190933/bright_113.gif") no-repeat right top;
   margin:0;
   padding:0;
   text-decoration:none;
   border:0;
   display:block;
   float:left;
}
#tab a span
{
   display:block;
   background:url("http://www.fileden.com/files/2007/6/19/1190933/bleft_113.gif") no-repeat left top;
   padding:0 22px 0 22px;
   font-family:Arial, Helvetica, sans-serif;
   font-size:11;
   color:#FFFFFF;
   font-weight:bold;
   line-height:36px;
}
#tab a:hover,#tab li.item_active a
{
   background-position:right bottom;
   border-color:;
}
#tab a:hover span,#tab li.item_active a span
{
   background-position:left bottom;
   color:#FFFFFF;
   font-weight:bold;
   font-style:normal;
   text-decoration:none;
}
.dropmenudiv
{
   position:absolute;
   top:0;
   float:left;
   display:block;
   visibility:hidden;
   border:0 solid ;
   background: #FFFFFF url("http://www.fileden.com/files/2007/6/19/1190933/bmid_113.gif");
   color:#FFFFFF;
   z-index:100;
   text-decoration:none;
   padding:0;
}
.dropmenudiv ul
{
   margin:0;
   padding:0;
   list-style:none;
}
.dropmenudiv li
{
   display:inline;
   margin:0;
   padding:0;
}
.dropmenudiv a:link, .dropmenudiv a:visited
{
   width:180px;
   margin:0;
   padding:0;
   display:block;
   border:0 solid ;
   color:#FFFFFF;
   background:url("http://www.fileden.com/files/2007/6/19/1190933/bleft_113.gif") no-repeat left top;
   font-weight:bold;
   font-style:normal;
   text-decoration:none;
}
.dropmenudiv a span
{
   float:left;
   display:block;
   line-height:36px;
   background:url("http://www.fileden.com/files/2007/6/19/1190933/bright_113.gif") no-repeat right top;
   padding:0 22px 0 22px;
   font-family:Arial, Helvetica, sans-serif;
   font-size:11;
   color:#FFFFFF;
}
.dropmenudiv a span
{
   float:none;
}
.dropmenudiv a:hover
{
   border:0 solid ;
   background-position:left bottom;
   font-weight:bold;
   font-style:normal;
   text-decoration:none;
   color:#FFFFFF;
}
.dropmenudiv a:hover span
{
   background-position:right bottom;
   color:#FFFFFF;
   font-weight:bold;
}

</style>
<div id="MainMenu">
   <div id="tab">
      <ul>
         <li class="item_active"><a href="#"><span>Home</span></a></li>
         <li><a href="#"><span>About</span></a></li>
         <li><a href="#"><span>Contact</span></a></li>
      </ul>
   </div>
</div>





Codigo pegalo por encima de la pagina

Código:
<style type="text/css">

#MainMenu
{
   height:41px;
   background: url('http://www.fileden.com/files/2007/6/19/1190933/bmid_063.gif');
   margin:0;
   border:0px none;
}
#tab
{
   margin:0;
   top:0;
}
#tab ul
{
   margin:0;
   padding:0;
   list-style:none;
   float:left;
}
#tab li
{
display:inline;
   float:left;
   margin:0;
   padding:0;
}
#tab a
{
   background:#000000 url('http://www.fileden.com/files/2007/6/19/1190933/bright_063.gif') no-repeat right top;
   margin:0;
   padding:0;
   text-decoration:none;
   border:0px none;
   display:block;
   float:left
}
#tab a span
{
   display:block;
   background:url('http://www.fileden.com/files/2007/6/19/1190933/bleft_063.gif') no-repeat left top;
   font-family:Arial, Helvetica, sans-serif;
   font-size:11;
   color:#4D4D4D;
   font-weight:bold;
   line-height:41px; padding-left:15px; padding-right:15px; padding-top:0; padding-bottom:0
}
#tab a:hover, #tab li.item_active a
{
   background-position:right bottom;
   border-color:#FF9300;
}
#tab a:hover span, #tab li.item_active a span
{
   background-position:left bottom;
   color:#000000;
   font-weight:bold;
   font-style:normal;
   text-decoration:none;
}
.dropmenudiv
{
   position:absolute;
   top:0;
   float:left;
   display:block;
   visibility:hidden;
   border:0px solid ;
   background: url('http://www.fileden.com/files/2007/6/19/1190933/bmid_063.gif');
   color:#4D4D4D;
   z-index:100;
   text-decoration:none;
   padding:0
}
.dropmenudiv ul
{
   margin:0;
   padding:0;
   list-style:none;
}
.dropmenudiv li
{
   display:inline;
   margin:0;
   padding:0;
}
.dropmenudiv a:link, .dropmenudiv a:visited
{
   width:180px;
   margin:0;
   padding:0;
   display:block;
   border:0px solid ;
   color:#4D4D4D;
   background:url('http://www.fileden.com/files/2007/6/19/1190933/bleft_063.gif') no-repeat left top;
   font-weight:bold;
   font-style:normal;
   text-decoration:none
}
.dropmenudiv a span
{
   float:left;
   display:block;
   line-height:41px;
   background:url('http://www.fileden.com/files/2007/6/19/1190933/bright_063.gif') no-repeat right top;
   font-family:Arial, Helvetica, sans-serif;
   font-size:11;
   color:#4D4D4D; padding-left:15px; padding-right:15px; padding-top:0; padding-bottom:0
}
.dropmenudiv a span
{
   float:none;
}
.dropmenudiv a:hover
{
   border:0px solid #FF9300;
   background-position: left bottom;
   font-weight:bold;
   font-style:normal;
   text-decoration:none;
   color:#000000
}
.dropmenudiv a:hover span
{
   background-position:right bottom;
   color:#000000;
   font-weight:bold;
}

</style>






<script type="text/javascript" src="http://h1.ripway.com/kristaldunya/4.js"></script>
<style>
#MainMenu
{
   height:41px;
   background: url("http://www.fileden.com/files/2007/6/19/1190933/bmid_063.gif");
   margin:0;
   border:0;
}
#tab
{
   margin:0;
   top:0;
}
#tab ul
{
   margin:0;
   padding:0;
   list-style:none;
   float:left;
}
#tab li
{
display:inline;
   float:left;
   margin:0;
   padding:0;
}
#tab a
{
   background:#000000 url("http://www.fileden.com/files/2007/6/19/1190933/bright_063.gif") no-repeat right top;
   margin:0;
   padding:0;
   text-decoration:none;
   border:0;
   display:block;
   float:left;
}
#tab a span
{
   display:block;
   background:url("http://www.fileden.com/files/2007/6/19/1190933/bleft_063.gif") no-repeat left top;
   padding:0 15px 0 15px;
   font-family:Arial, Helvetica, sans-serif;
   font-size:11;
   color:#4D4D4D;
   font-weight:bold;
   line-height:41px;
}
#tab a:hover,#tab li.item_active a
{
   background-position:right bottom;
   border-color:#FF9300;
}
#tab a:hover span,#tab li.item_active a span
{
   background-position:left bottom;
   color:#000000;
   font-weight:bold;
   font-style:normal;
   text-decoration:none;
}
.dropmenudiv
{
   position:absolute;
   top:0;
   float:left;
   display:block;
   visibility:hidden;
   border:0 solid ;
   background: url("http://www.fileden.com/files/2007/6/19/1190933/bmid_063.gif");
   color:#4D4D4D;
   z-index:100;
   text-decoration:none;
   padding:0;
}
.dropmenudiv ul
{
   margin:0;
   padding:0;
   list-style:none;
}
.dropmenudiv li
{
   display:inline;
   margin:0;
   padding:0;
}
.dropmenudiv a:link, .dropmenudiv a:visited
{
   width:180px;
   margin:0;
   padding:0;
   display:block;
   border:0 solid ;
   color:#4D4D4D;
   background:url("http://www.fileden.com/files/2007/6/19/1190933/bleft_063.gif") no-repeat left top;
   font-weight:bold;
   font-style:normal;
   text-decoration:none;
}
.dropmenudiv a span
{
   float:left;
   display:block;
   line-height:41px;
   background:url("http://www.fileden.com/files/2007/6/19/1190933/bright_063.gif") no-repeat right top;
   padding:0 15px 0 15px;
   font-family:Arial, Helvetica, sans-serif;
   font-size:11;
   color:#4D4D4D;
}
.dropmenudiv a span
{
   float:none;
}
.dropmenudiv a:hover
{
   border:0 solid #FF9300;
   background-position:left bottom;
   font-weight:bold;
   font-style:normal;
   text-decoration:none;
   color:#000000;
}
.dropmenudiv a:hover span
{
   background-position:right bottom;
   color:#000000;
   font-weight:bold;
}

</style>
<div id="MainMenu">
   <div id="tab">
      <ul>
         <li class="item_active"><a href="#"><span>Home</span></a></li>
         <li><a href="#"><span>About</span></a></li>
         <li><a href="#"><span>Contact</span></a></li>
      </ul>
   </div>
</div>




Codigo pegalo por encima de la pagina

Código:
<style type="text/css">

#MainMenu
{
   height:37px;
   background: #FFFFFF;
   margin:0;
   border:0px none;
}
#tab
{
   margin:0;
   top:0;
}
#tab ul
{
   margin:0;
   padding:0;
   list-style:none;
   float:left;
}
#tab li
{
display:inline;
   float:left;
   margin:0;
   padding:0;
}
#tab a
{
   background: url('http://www.fileden.com/files/2007/6/19/1190933/bright_109.gif') no-repeat right top;
   margin:0;
   padding:0;
   text-decoration:none;
   border:0px none;
   display:block;
   float:left
}
#tab a span
{
   display:block;
   background:url('http://www.fileden.com/files/2007/6/19/1190933/bleft_109.gif') no-repeat left top;
   font-family:Arial, Helvetica, sans-serif;
   font-size:11;
   color:#FFFFFF;
   font-weight:bold;
   line-height:37px; padding-left:25px; padding-right:25px; padding-top:0; padding-bottom:0
}
#tab a:hover, #tab li.item_active a
{
   background-position:right bottom;
   border-color:;
}
#tab a:hover span, #tab li.item_active a span
{
   background-position:left bottom;
   color:#000000;
   font-weight:bold;
   font-style:normal;
   text-decoration:none;
}
.dropmenudiv
{
   position:absolute;
   top:0;
   float:left;
   display:block;
   visibility:hidden;
   border:0px solid ;
   background: #FFFFFF;
   color:#FFFFFF;
   z-index:100;
   text-decoration:none;
   padding:0
}
.dropmenudiv ul
{
   margin:0;
   padding:0;
   list-style:none;
}
.dropmenudiv li
{
   display:inline;
   margin:0;
   padding:0;
}
.dropmenudiv a:link, .dropmenudiv a:visited
{
   width:180px;
   margin:0;
   padding:0;
   display:block;
   border:0px solid ;
   color:#FFFFFF;
   background:url('http://www.fileden.com/files/2007/6/19/1190933/bleft_109.gif') no-repeat left top;
   font-weight:bold;
   font-style:normal;
   text-decoration:none
}
.dropmenudiv a span
{
   float:left;
   display:block;
   line-height:37px;
   background:url('http://www.fileden.com/files/2007/6/19/1190933/bright_109.gif') no-repeat right top;
   font-family:Arial, Helvetica, sans-serif;
   font-size:11;
   color:#FFFFFF; padding-left:25px; padding-right:25px; padding-top:0; padding-bottom:0
}
.dropmenudiv a span
{
   float:none;
}
.dropmenudiv a:hover
{
   border:0px solid ;
   background-position: left bottom;
   font-weight:bold;
   font-style:normal;
   text-decoration:none;
   color:#000000
}
.dropmenudiv a:hover span
{
   background-position:right bottom;
   color:#000000;
   font-weight:bold;
}

</style>


















<script type="text/javascript" src="http://h1.ripway.com/kristaldunya/chromey.js"></script>
<style>
#MainMenu
{
   height:37px;
   background: #FFFFFF;
   margin:0;
   border:0;
}
#tab
{
   margin:0;
   top:0;
}
#tab ul
{
   margin:0;
   padding:0;
   list-style:none;
   float:left;
}
#tab li
{
display:inline;
   float:left;
   margin:0;
   padding:0;
}
#tab a
{
   background: url("http://www.fileden.com/files/2007/6/19/1190933/bright_109.gif") no-repeat right top;
   margin:0;
   padding:0;
   text-decoration:none;
   border:0;
   display:block;
   float:left;
}
#tab a span
{
   display:block;
   background:url("http://www.fileden.com/files/2007/6/19/1190933/bleft_109.gif") no-repeat left top;
   padding:0 25px 0 25px;
   font-family:Arial, Helvetica, sans-serif;
   font-size:11;
   color:#FFFFFF;
   font-weight:bold;
   line-height:37px;
}
#tab a:hover,#tab li.item_active a
{
   background-position:right bottom;
   border-color:;
}
#tab a:hover span,#tab li.item_active a span
{
   background-position:left bottom;
   color:#000000;
   font-weight:bold;
   font-style:normal;
   text-decoration:none;
}
.dropmenudiv
{
   position:absolute;
   top:0;
   float:left;
   display:block;
   visibility:hidden;
   border:0 solid ;
   background: #FFFFFF;
   color:#FFFFFF;
   z-index:100;
   text-decoration:none;
   padding:0;
}
.dropmenudiv ul
{
   margin:0;
   padding:0;
   list-style:none;
}
.dropmenudiv li
{
   display:inline;
   margin:0;
   padding:0;
}
.dropmenudiv a:link, .dropmenudiv a:visited
{
   width:180px;
   margin:0;
   padding:0;
   display:block;
   border:0 solid ;
   color:#FFFFFF;
   background:url("http://www.fileden.com/files/2007/6/19/1190933/bleft_109.gif") no-repeat left top;
   font-weight:bold;
   font-style:normal;
   text-decoration:none;
}
.dropmenudiv a span
{
   float:left;
   display:block;
   line-height:37px;
   background:url("http://www.fileden.com/files/2007/6/19/1190933/bright_109.gif") no-repeat right top;
   padding:0 25px 0 25px;
   font-family:Arial, Helvetica, sans-serif;
   font-size:11;
   color:#FFFFFF;
}
.dropmenudiv a span
{
   float:none;
}
.dropmenudiv a:hover
{
   border:0 solid ;
   background-position:left bottom;
   font-weight:bold;
   font-style:normal;
   text-decoration:none;
   color:#000000;
}
.dropmenudiv a:hover span
{
   background-position:right bottom;
   color:#000000;
   font-weight:bold;
}

</style>
<div id="MainMenu">
   <div id="tab">
      <ul>
         <li class="item_active"><a href="#"><span>Home</span></a></li>
         <li><a href="#"><span>About</span></a></li>
         <li><a href="#"><span>Contact</span></a></li>
      </ul>
   </div>
</div>


Espero k les gusten
______________









Ultima edición por wedmasterayuda el Mar Oct 21, 2008 8:31 pm; editado 1 vez
↑
Mensaje21-10-2008, 23:13 (UTC)    
Título del mensaje:
Responder citando
muy weno los menus gracias por los codes
me gusta mas el primero
saludos!
↑
Mensaje21-10-2008, 23:13 (UTC)    
Título del mensaje:
Responder citando
ME GUSTO LA PRIMERA OJALA PUSIERAS UNA QUE EL BOTON NORMAL SEA ROJO Y AL PASAR SEA NEGRO PERO CON ESE EFECTO DE CUADROS EN 3D

BUENOS LOS MENUS, ESPERO QUE PONGAS LA SUGERENCIAS QUE TE DIJE....

SALU2
______________
- THEKINGMARINE TRAILERS -
...Lo Mejor En Trailers De Cine...



↑
Mensaje21-10-2008, 23:20 (UTC)    
Título del mensaje:
Responder citando
Ok ojala pongan estos en la zona Css codes
______________
↑
Mensaje21-10-2008, 23:21 (UTC)    
Título del mensaje:
Responder citando
es muy facil debes cambia las url que aparecen por las que tu quieres que son un boton rojo y uno negro

busca algo negro y algo rojo y yo telo hago
↑
Mensaje21-10-2008, 23:25 (UTC)    
Título del mensaje:
Responder citando
Correcto es muy simple hacerlo miren para el proximo post voy aser uno parecido a este


______________
↑
Mensaje21-10-2008, 23:28 (UTC)    
Título del mensaje:
Responder citando
ese es mucho mejor

todavia
↑
Mensaje21-10-2008, 23:29 (UTC)    
Título del mensaje:
Responder citando
Si pues si quieren lo coloco ya??
______________
↑
Mensaje22-10-2008, 00:35 (UTC)    
Título del mensaje:
Responder citando
hola master muy bueno el menu pero no me lleva a ningun lado o sea donde coloco la direccion para que cuando le hagas click te lleve a un lugar?...y como le agrego mas botones? gracias...
______________
↑
Mensaje22-10-2008, 00:45 (UTC)    
Título del mensaje:
Responder citando
Mira todos los codigos a lo ultimo tienen este codigo

Cita:
</style>
<div id="MainMenu">
<div id="tab">
<ul>
<li class="item_active"><a href="#"><span>Nombre del link</span></a></li>
<li><a href="#"><span>Nombre del link</span></a></li>
<li><a href="#"><span>Nombre del link</span></a></li>
</ul>
</div>
</div>


Leyenda:
#: Url donde te llevara el link
______________
↑
Mensaje22-10-2008, 02:49 (UTC)    
Título del mensaje:
Responder citando
Gracias me gusto mas esta: http://i38.tinypic.com/ngccit.jpg
______________
Firma eliminada por promocion a foros externos.

[b]Moderador Design-PWG[/b]
↑
Mensaje22-10-2008, 09:44 (UTC)    
Título del mensaje:
Responder citando
wow estan buenisimos pero esos menus creo que son sacados del servicio en alemania
______________

Plantillas | CSS | HTML | Normas del foro | Contacto | Tutoriales
Mail de ayuda: contacto@radioflash.com

↑
Mensaje22-10-2008, 09:55 (UTC)    
Título del mensaje:
Responder citando
no son de alemania sino de bedava sitem
↑
Mensaje22-10-2008, 09:59 (UTC)    
Título del mensaje:
Responder citando
pos eso entonces penso que no nos dariamos cuenta jum
______________

Plantillas | CSS | HTML | Normas del foro | Contacto | Tutoriales
Mail de ayuda: contacto@radioflash.com

↑
Mensaje22-10-2008, 10:04 (UTC)    
Título del mensaje:
Responder citando
jaja si el talves penso que nadie revisa los otros foros xD


Ultima edición por luxurydesign el Mie Oct 22, 2008 6:08 am; editado 1 vez
↑
Mostrar mensajes anteriores:   
  • Página 1 de 2

  •  
    • Saltar a:  


Powered by phpBB © 2001, 2005 phpBB Group

© 2024 webme GmbH, Alemania. Todos los derechos reservados.