Regresar a la página www.ComoCrearTuWeb.com
Resultados 1 al 2 de 2

Tema: Menu desplegable

Vista Híbrida

  1. #1
    Recien Llegado! Pasaba por aquí...
    Fecha de Ingreso
    05 nov, 17
    Mensajes
    1
    Poder de Reputación
    0

    Menu desplegable

    Hola amigos,
    es primera vez que participo en el foro.
    Mi duda es como hago que un menu desplegable no me aparesca en forma de escalones,
    yo lo quiero en forma horizontal.
    Actualmente lo tengo horizontal, pero con escalones.
    Gracias.

    CODIGO HTML:

    <nav id="menu">
    <h2>Aqui encontrara todo lo relacionado a tecnologia </h2>
    <ul>
    <li><a href="Computadoras Portátiles"</a>Computadoras Portátiles</li>
    <li><a href="Computadoras de Escritorio"</a>Computadoras de Escritorio
    <ul>
    <li><a href="Accesorios"</a>Accesorios</li>
    <li><a href="Muebles"</a>Muebles</li>
    <li><a href="Entretenimiento"</a>Entretenimiento</li>
    </ul>
    </li>
    <li><a href="Celulares"</a>Celulares</li>
    <li><a href="Cámaras fotográficas"</a>Cámaras fotográficas</li>
    <li><a href="Impresoras"<7a>Impresoras</li>
    <li><a href="Fotocopiadoras"</a>Fotocopiadoras</li>
    </ul>
    </nav>


    CODIGO CSS:

    #menu ul {
    list-style:none;
    margin:0;
    padding:0;
    }

    /* items del menu */

    #menu ul li {
    background-color:#2e518b;
    }

    /* enlaces del menu */

    #menu ul a {
    display:block;
    color:#fff;
    text-decoration:none;
    font-weight:400;
    font-size:15px;
    padding:10px;
    font-family:"HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-transform:uppercase;
    letter-spacing:1px;
    }

    /* items del menu */

    #menu ul li {
    position:relative;
    float:left;
    margin:0;
    padding:0;
    }

    /* efecto al pasar el ratón por los items del menu */

    #menu ul li:hover {
    background:#5b78a7;
    }/* menu desplegable */

    #menu ul ul {
    display:none;
    position:absolute;
    top:100%;
    left:0;
    background:#eee;
    padding:0;
    }

    /* items del menu desplegable */

    #menu ul ul li {
    float:none;
    width:160px
    }

    /* enlaces de los items del menu desplegable */

    #menu ul ul a {
    line-height:120%;
    padding:10px 15px;
    }

    /* items del menu desplegable al pasar el ratón */

    #menu ul li:hover > ul {
    display:block;

  2. #2
    Esto empieza a ser un vicio... Habitante Avatar de omar.piamba
    Fecha de Ingreso
    09 dic, 07
    Ubicación
    Colombia, Trinidad (Casanare)
    Mensajes
    307
    Poder de Reputación
    16
    Tiene errores en todas las líneas de <a>:
    <a href="Computadoras Portátiles"</a>Computadoras Portátiles
    Debe ser así:
    <a href="computadoras-portatiles.html">Computadoras Portátiles</a>
    y crear una hoja llamada computadoras-portatiles.html y así sucesivamente

Temas Similares

  1. Menu desplegable
    Por jhon1946 en el foro Foro General
    Respuestas: 1
    Último Mensaje: 27/06/2011, 22:06
  2. Como insrtar menu desplegable en mi web (Sothink DHTML Menu)
    Por Salvador_Valencia en el foro Foro General
    Respuestas: 3
    Último Mensaje: 03/08/2010, 11:33
  3. Menu desplegable
    Por jpablocg en el foro Curso Paso a Paso con Html-Kit.
    Respuestas: 1
    Último Mensaje: 06/10/2009, 12:56

Permisos de Publicación

  • No puedes crear nuevos temas
  • No puedes responder temas
  • No puedes subir archivos adjuntos
  • No puedes editar tus mensajes
  •