oletusWEBos.es - Lecciones paso a paso para crear tu web. Tutoriales de Dreamweaver, HTML y CSS
Curso Dreamweaver - Lección 5: Menú de Navegación II
Perfecto, ya tenemos creado nuestro menú de navegación pero para que sea eficaz habrá que asignarle unos hipervinculos no? eso ya deberías saber hacerlo jeje mira aquí para recordarlo.
Bien vamos a crear un vinculo solamente a una sección de cada categoría (simplemente para que veas como se hace, tu para practicar deberías hacerlo en todas las secciones del menú de navegación) para ello nos vamos a nuestro menú de navegación y sombreamos con el cursor del raton la marca de motos Honda. Ahora en la ventana propiedades en el recuadro de texto "Vinculo" escribiremos el vinculo hacia otra página de nuestra web que se llamará honda.html (allí estaran todas las motos de esa marca)...
¿y te preguntaras? ¿por qué le ponemos el vinculo si todavía no hemos creado la página honda.html? Pues tiene su explicación y te lo diré mas adelante.
Ahora crearemos otro vinculo a la sección Cascos de nuestro menú de navegación, sigue los pasos citados anteriormente para crear el vinculo a Honda pero esta vez en el recuadro de texto del vinculo escribiras evidentemente cascos.html es aquí donde estara el stand de todos los cascos de nuestra tienda. Como ejercicio y como ya te he comentado antes deberías poner el vinculo a todas las secciones de nuestro menú de navegación.
Si le das al botón de vista previa veras que ahora nos aparece subrayado y en azul las palabras a las que le hemos asignado un vinculo pero.... no se a mi no me termina de gustar y ¿a ti? vamos a cambiarle ese aspecto y para ello insertaremos un código en nuestra hoja de estilos anteriormente creada.
Abrimos nuestra hoja de estilos para ello haz doble click en estilo.css he insertamos el siguiente código:
a:link {
color: red;
text-decoration: none;<7p>
}
A:hover {
text-decoration: underline overline;
color: blue;
}
Esto hara que todos los vínculos de nuestra web esten en color rojo y que cuando pongamos el cursor sobre alguno de ellos esten en color azul y con una raya encima y debajo de las letras a las que se les ha asignado un vinculo.
En la siguiente captura veremos como honda muestra que es una palabra a la que se le ha asignado un vinculo y cascos seria una palabra con un vinculo asignado y con el cursor del raton encima.
Con esto acabamos la lección 5, hemos visto como crearnos un menú vertical de navegación para nuestra web así como añadir algunas reglas a nuestra hoja de estilos.
En la próxima y ultima lección veremos como crear plantillas para nuestra web así como la importancia de los encabezados que pongamos en las distintas páginas que componen nuestra web.
Venga vamos a por la ultima lección... lección 6
Quiero aprender más!!!
- Avanzar a Lección 6: Encabezados
- Retroceder a Lección 5: Menú de Navegación
©oletusWEBos 2009 all right reserved | Contácta con oletusWEBos.es
Design By: JTole®