Aprende crea y diseña tu propio negocio de páginas web tutorial

Un gusto en saludarles mis queridos lectores para mí es un placer de traerles la 6ta parte del curso de diseño web.
Estuve un poco alejado de estos tutoriales ya que es algo que requiere un poco de tiempo y dedicación, pero me estaba trabajando en otros proyectos de mis estudios universitarios.

Sin más preámbulo comencemos, hoy les mostrareré un menú desplegable con css y html.

`Paso 1`

Comenzamos por crear una lista para el menú.
Si desconoces como crear una lista visita mi post en el siguiente enlace Lista

`Paso 2`

Colocamos la etiqueta nav con un atributo id para identificar el menu.

`Paso 3`

Colocamos los href="#". Estos son los que llevan a los link enlazados de las páginas que colocamos en el menú.

`Paso 4`

Se colocan las propiedades en el documento css para darle el estilo a el menú ya que hay muchos tipos de propiedades, puedes probarlos todos los que gustes aquí una pagina de propiedades css explicadas cada una de ellas.

`Aquí podemos visualizar como nuestro menú va mostrando un mejor estilo`

`Paso 5`

Para crear este tipo de menú, aplicaremos la regla CSS display que hará que los enlaces dentro del desplegable sólo se muestren al pasar el ratón.

PD: Si te fijas, por defecto escondemos los enlaces del submenú con display: none y luego los mostramos aplicando display: block con el selector :hover

Además, para que nuestros enlaces aparezcan de forma vertical y no horizontal como en el menú principal, aplicaremos la regla CSS de float: none

`Nuestro resultado.`

`PD: Colocamos una foto de fondo para un mejor aspecto de nuestro menú`

Esto a sido todo por el dia de hoy, espero que hayan aprendido algo de este tutorial cualquier duda dejenmela en los comentarios que con gusto les respondere.