Home Tips HTML & CSS Ejemplo menú con CSS3

Ejemplo menú con CSS3

Jueves, 17 Marzo 2011 | Escrito por Jhon Marreros Guzman

Detalles Tip - Nivel : Intermedio Avanzado, Formato : Video.
En este tip veremos la construcción de un menú de un nivel, se usa CSS3 para mejorar los aspectos visuales del mismo en los navegadores que soportan esta tecnología, se explica además el uso de los prefijos de navegador así como la mejora progresiva que debe ser tomada en cuenta a la hora de utilizar CSS3.

En el siguiente video se muestra un ejemplo de construcción de un menú usando CSS3.

Suscríbete a monitojoomla en youtube para que puedas ver todos los videos publicados

 

Generalidades

CSS3 ofrece mejoras en los estilos que podemos implementar en nuestros sitios web, para ver una lista completa de las nuevas características puedes vistar el siguiente link: Css3 info

 

 

 

Comparte este postDel.icio.us! Google! Live! Facebook! Twitter! Joomla Free PHP
Comentarios (16)
  • 19-03-2011 jesus ramos
    avatar
    hola monito recibe un cordial saludo desde cusco peeru, y decirte que soy un acido seguidor tuyo y espero que sigas sacando mas videos sobre este fabuloso prgorama.
    bueno para consultare instal una plantilla en mi como extensiones en joomla 1.6 y al actualizar la web no sale nada mas que el diseño solamente no sale los modulos, no sales el encavezado, no sale la barra de menus en la parte superior, quisiera por favor me ayudes que es lo que estoy ahciendo mal la web es esta http://www.jrcontadores.zobyhost.com/
    gracias
    Responder
  • 19-03-2011 Jhon Marreros
    avatar
    Hola Jesus
    Debes verificar las posiciones del template nuevo, es posible que los módulos que tienes se encuentren configurados con posiciones diferentes de las que tiene tu nuevo template.
    Para este tipo de consultas te recomiendo visitar los foros en donde se puede crear un hilo de discusión.

    Saludos.
    Responder
  • 20-03-2011 David
    avatar
    Muy bueno,

    a ver si con la salida de IE9 la gente empieza a usar más CSS3 y HTML5..

    Un saludo y gracias por el tip
    Responder
  • 20-03-2011 paputxi14
    avatar
    Excelentes videotutoriales y gracias por compartirlos.

    Son los mejores que he visto por la red. Ya tienes un nuevo seguidor/fan tuyo.

    Saludos, gracias y suerte.
    Responder
  • 22-03-2011 abdiel
    avatar
    hola Jhon, me encanto este tuto, muy bueno.
    no se si lo permitas hacer, me corro el riesgo, pero es acerca de otro post que hiciste, allí coloque un comentario y una pregunta y quería saber si me podrías dar un momentito de tu agendita para darme un apoyito en esto gracias. el post es el de: Agregar datos adicionales al módulo de contenido más leído.
    de antemano gracias y sigue así, nos colocas lo complicado de nivel 10 a nivel de super comprensión, jeje
    Responder
  • 28-03-2011 Richard
    avatar
    Muy buen tutorial
    Responder
  • 29-03-2011 Jairo Acosta
    avatar
    Hola, me gustaría saber qué editor estás utilizando, pues me llamó mucho la atención la facilidad y las vistas de editor y diseño que presenta.
    Responder
  • 30-03-2011 Jhon Marreros
    avatar
    Hola Jairo

    Es Coda para mac

    Saludos.
    Responder
  • 03-05-2011 daniel solis
    avatar
    muy interesante!!!, muchas gracias por compartir esta funcionalidad

    saludos.

    Responder
  • 13-05-2011 mykimar
    avatar
    hola Jhon Marreros Quisiera que me ayudes pues no encuentro mejor lugar para que puedas colaborar con tus conocimientos.

    Tengo un template basico gratuito en joomla pero quiero agregarle un menu vertical y uno horizontal que encontré en esta web:
    http://www.styledmenus.com/2008/12/jogi-css-menu.html

    Quiero saber como puedo adicionar este menu al template que pasos debo realizar. Por favor quiero que me ayudes. Gracias de antemano Jhon.
    Responder
  • 13-05-2011 mykimar
    avatar
    Hola Jhon quisiera que por favor me ayudes con el comentario que te he enviado.
    Un abrazo
    Muchas gracias.
    Responder
  • 18-05-2011 Jhon Marreros
    avatar
    Hola mykimar

    Si no tienes muchos conocimientos de programación, lo más recomendables es buscar un menú desde el centro de extensiones que cumplan tus necesidades. http://extensions.joomla.org/search?q=menu

    Saludos.
    Responder
  • 18-05-2011 Todespo
    avatar
    Hola, interesante tutorial, especialmemte para los que estamos comenzando con joomla, solo tengo una duda, hice los estilos para cambiar el menú, pero en IE no funciona, tengo el IE 8, como puedo hacer para que funcione este estilo en IE.

    Gracias

    Saludos
    Responder
  • 18-05-2011 Jhon Marreros
    avatar
    Sólo es para navegadores compatibles, es una mejora visual que no necesariamente debe verse igual en todos los navegadores, si quieres q funcione en IE tienes q hacerlo por javascript.

    Saludos.
    Responder
  • 14-08-2011 betto
    avatar
    hola amigo jhon.
    me ha interesado mucho los tutos q haces, quisiera saber si me podrias ayudar con un tutorial de como crear menu desplegables como el q tienes en tu sitio(parte superior)... bueno el caso es q me ha interesado la creacion de plantillas para joomla y la creacion del menu desplegable me falta.

    no se que hay q hacer para q joomla interprete y cree el nuevo item de menu...

    de ente mano gracias...
    saludos!
    Responder
  • 23-02-2012 Willie Sans
    avatar
    Hola Jhon muchas gracias por compartir tus conocimientos . Si tienes tiempo me gustaria seguir otro videotutorial para crear menus desplegables personalizados , Bendiciones y muchos éxitos .
    Responder
Escribir comentario
Gravatar enabled