Curso de Professional CSS & CSS3

Categories: Desarrollo Web
Lista de deseos Share
Share Course
Page Link
Share On Social Media

Acerca de este curso

> Módulo 1. Arquitectura y organización CSS

Organización de archivos

Consideraciones

Utilice los selectores de tipo y atributo con precaución

Elegir qué nombrar cosas

Modificador de elemento de bloque (BEM)

CSS atómico

 

> Módulo 2. Propiedades personalizadas y novedades

Definir y usar una propiedad personalizada

Establecer un valor de reserva

Propiedades personalizadas y la cascada

Propiedades y componentes personalizados

Uso de propiedades personalizadas y consultas de medios

Novedades CSS3: border-radius, box-shadow, text-shadow, RGBA, opacity, background múltiple, etc.

 

> Módulo 3. Trabajar con texto

Texto de mejor aspecto con @ font-face

Usar múltiples formatos de fuente

Incorporación de fuentes variables

Subconjunto usando fuentes de Google

Gestionar la composición tipográfica con orientación de texto

Modo de escritura y alineación

 

> Módulo 4. Layouts

Tipos de pantalla y flujo normal

Formato de bloque versus formato en línea

Dimensiones de la caja y el modelo de la caja

Gestión de dimensiones de caja con tamaño de caja

Elementos flotantes y flujo normal

Elementos de posicionamiento y apilamiento

Uso del diseño de varias columnas CSS

Crear diseños con CSS Grid

El contexto de formato de grid

Crear diseños flexibles con Flexbox

Alineación y distribución de cajas

Elegir flex o grid

 

> Módulo 5. Transiciones y animaciones

Transiciones CSS

Creando tu primera transición y uso de propiedades

Funciones de tiempo

Transición de múltiples propiedades

Múltiples transiciones y eventos de transición

Animación CSS y propiedades

Creando tu primera animación

 

> Módulo 6. Transformaciones

Cómo las transformaciones afectan el diseño

Funciones de transformación 2D y rotate()

Funciones de escalado 2D: escala, escala X y escala Y

Funciones de traslación 2D: translateX, translateY y translate

skew, skewX y skewY

Funciones de transformación 3D

rotateX () y rotateY ()

Preservando tres dimensiones con estilo transformado

Mostrar ambas caras con la propiedad de visibilidad posterior

 

> Módulo 7. Aplicación de CSS condicionalmente

Media queries y @media

Reglas de anidamiento @media

Trabajando alrededor del soporte de navegador heredado con solo

Media Queries basadas en contenido

Escuchando los cambios en media

 

> Módulo 8. Uso de CSS con SVG

Imágenes vectoriales versus imágenes ráster

Asociar CSS con documentos SVG

Incrustar CSS en documentos SVG

Vinculación de SVG a un archivo CSS externo

Estilo de elementos SVG

Animación y transición de propiedades CSS SVG

What Will You Learn?

  • Organizar su CSS para crear el código más eficiente y más fácil de mantener
  • Emplear enfoques avanzados para lograr diseños complejos: flexbox, diseños de grid, columnas múltiples y más
  • Usar efectos de CSS3: transiciones, transformaciones, filtros, animaciones y más.
  • Combinar CSS y SVG para crear imágenes muy poderosas

Course Content

Student Ratings & Reviews

No Review Yet
No Review Yet