Introducción a CSS3

Al igual que hablamos de HTML5, que el cambio en la maquetación web iba a suponer un gran avance. De CSS3 podemos decir, practicamente lo mismo. Las nuevas etiquetas que nos trae esta nueva versión, nos permitirán hacer cosas, que antes dependíamos totalmente de imagenes y otros lenguajes de programación, ya fueran del lado del servidor como PHP, ASP, Ruby, Java...., como lenguajes del lado del cliente como Javascript y Ajax.

Con CSS3, tendremos la posibilidad de hacer bordes redondeados, sombras tanto en cajas como en texto, transiciones, animaciones y otras muchas cosas más.

Para ver todos estos avances, he dividido esta sección en los siguientes módulos, para ver tanto la teoría y la sintaxis que deberemos utilizar como ejemplos reales de su utilización.

También como con HTML5, en nuestro laboratorio uniremos estos conocimientos a otros aprendidos para realizar proyectos e investigaciones de funcionamiento en casos mas reales.

Los módulos que aprenderemos serán los siguientes:

1. Bordes
   
   • Esquinas redondeadas
   • Bordes sombreados
   • Bordes con imagenes
2. Background
   
   • Propiedad background-size
   • Propiedad background-origin
   • Múltiples imágenes de fondo
3. Efectos de texto
   
   • Texto sombreado
   • Propiedad Word-wrap
4. Fuentes
   
   • Propiedad @font-face
   • Otras opciones (google Font…)
5. Transformaciones 2D y 3D
   
   • Transformaciones 2D
     
     • Introducción
     • El método translate()
     • El método rotate()
     • El método scale()
     • El método skew()
     • El método matrix()
   • Transformaciones 3D
     
     • Introducción
     • El método rotatex()
     • El método rotatey()
6. Transiciones
   
   • Introducción
   • Como trabajan la propiedad transition
   • Múltiples transiciones
7. Animaciones
   
   • Introducción
   • @keyframes
   • La animación CSS3
   • ¿Tipos de animaciones con CSS3?
   • Propiedades de la animación con CSS3