Hojas de Estilo CSS3

Duración: 

20 Horas

Costo:

$ 310.000

Modalidad de estudio: 

Virtual 

Inscripciones:

Abiertas 

El lenguaje CSS o hojas de estilo en cascada nos permite dar estilo a un documento de marcas por ejemplo realizado con HTML o XML. Con CSS podemos definir un estilo concreto para los elementos de nuestra página web.


CSS3 es la última versión disponible del lenguaje de marcas, que nos permite crear estilos específicos para nuestras páginas, y que combinado con lenguajes como JavaScript podremos aplicar efectos especiales para interactuar con los usuarios.


Este curso realiza un recorrido completo por los principales elementos disponibles en CCS3. Colores y texto, degradados, transformaciones, transiciones y animaciones son algunos de los elementos que se desarrollan de tal forma que el alumno pueda aprender de forma sencilla y muy práctica para diseñar páginas web siguiendo las nuevas tendencias utilizadas en hojas de estilo.

  • Definir un estilo concreto para los elementos de la página web.
    Trabajar con colores y texto dando un estilo propio a las mismas.
  • Realizar transformaciones y transiciones animadas sin necesidad de utilizar otros lenguajes de programación.
  • Dominar la creación de animaciones en CSS3.
  • Trabajar con soltura con fuentes y diseño multicolumna en CSS3.

UNIDAD 1. Introducción a CSS3
¿Qué es CSS3?
Selectores CSS3
Selectores relacionales
Selectores de atributo
Pseudo-clases
Pseudo-clases estructurales
Pseudo-elementos y contenido generado
Contenido generado
Video ejercicio – Introducción a CSS3
Autopráctica – Selectores
Autopráctica – Pseudo-elementos
Test – Introducción a CSS3

UNIDAD 2. Colores y texto en CSS3
Colores HSL
Colores HSLA
Colores RGBA
Opacidad
Text-shadow
Text-overflow
Rotura de palabras largas
Web Fonts
Border-Radius
Sombras
Video ejercicio – Colores y texto en CSS3
Autopráctica – Página web formulario
Autopráctica – Border-Radius y sombras
Test – Colores y texto en CSS3

UNIDAD 3. Degradados en CSS3
Degradados lineales
Degradados radiales
Degradados lineales de repetición
Degradados radiales de repetición
Múltiples imágenes de fondo
Tamaño de fondo
Video ejercicio – Degradados en CSS3
Autopráctica – Creando degradados I
Autopráctica – Creando degradados II
Test – Degradados en CSS3

UNIDAD 4. Transformaciones y Transiciones
Transiciones
Transition-property
Transition-duration
Transition-timing-function
Transition-delay
La propiedad abreviada transition
Múltiples transiciones
Transformaciones
Traslación
Escalar
Rotación
Inclinación
Cambiar el origen de la transformación
Video ejercicio – Transformaciones y Transiciones
Autopráctica – Estilos de transición
Autopráctica – Estilo de transformación
Test – Transformaciones y transiciones

UNIDAD 5. Animaciones en CSS3
Animaciones
Fotogramas clave
Propiedad animation-name
Propiedad animation-duration
Propiedad animation-timing-function
Propiedad animation-iteration-count
Propiedad animation-direction
Propiedad animation-delay
Propiedad animation-fill-mode
Propiedad animation-play-state
Propiedad abreviada animation
Video ejercicio – Animaciones en CSS3
Autopráctica – Crear una animación I
Autopráctica – Crear una animación II
Test – Animaciones en CSS3

UNIDAD 6. Fuentes y Diseño multicolumna en CSS3
Importar fuentes tipográficas mediante Font-face
Aplicar la fuente
Tipos de fuentes y navegadores
La propiedad column-count
La propiedad column-gap
La propiedad column-width
La propiedad abreviada columns
Columnas y la propiedad height
Propiedad column-rule
Salto de columna
Inserción de imágenes
Textos multicolumna
Video ejercicio – Fuentes y Diseño multicolumna en CSS3
Autopráctica – Texto multicolumnas
Autopráctica – Mofidicar un texto multicolumnas
Test – Fuentes y Diseño multicolumna en CSS3