Curso Cómo animar tu web con estilos Css3. Dreamweaver

Aprende cómo hacer animaciones para sitios web mediante los estilos Css3 en Dreamweaver. Podemos creer que la única forma de animar los distintos elementos de nuestro sitio web es mediante Flash; sin embargo, en Dreamweaver podemos generar fantásticas animaciones para el sitio web mediante los estilos Css3.

En esta oportunidad, y con el objetivo de ejemplificar los porcedimientos para hacer animaciones con estilos Css3, vamos a enseñarte a crear un menú animado para tu página Web. Ya verás que el resultado es igual de bueno que un menú animado en Flash.

Para comenzar debemos tener ya instalado el programa Dreanweaver en nuestra PC, luego abrimos un nuevo documento HTML y creamos una caja básica donde colocamos los textos que vamos a utilizar.

Una vez hecho esto, nos vamos a la sección de estilos y vamos eligiendo entre sus opciones, las cuales están el color de fondo, tamaño de la caja, configuración de texto, etc. De igual forma vamos a configurar el body, lo seleccionamos, nos vamos a estilos y elegimos también entre las opciones existentes.

Posteriormente, nos dirigimos a vínculo, elegimos almohadilla en todos para colocar un enlace en cada uno de los textos y de esa manera al hacer un clic sobre éste para nos lleve al lugar deseado.

Elegimos cualquiera de los textos, seleccionamos la etiqueta para Css3 y vamos dando la forma y estilo que nosotros deseamos a nuestro texto, tal como lo vemos en este vídeo. Para que la vista cambie al pasar el cursor del mouse por encima del texto, creamos una nueva capa de estilos y elegimos cuál es la opción que deseamos cambiar.

Si deseamos tener un mayor efecto de animación debemos ir a las propiedades y elegir una propiedad para los navegadores webkit, de esa forma te será mucho más fácil obtener el resultado que deseas. Sigue todos los detalles en la explicación ampliada del vídeo.