Regresar al curso
De Adobe Illustrator a Bootstrap 5: ¡De Cero hasta Experto!
Módulo 1: Introducción al curso
9- ¿Qué aprenderemos en este curso? 04 minClase1.1
- ¿Cómo utilizar los recursos de este curso? 02 minClase1.2
- Descargar recursos usados en este cursoClase1.3
- Instalación de herramientas básicas 08 minClase1.4
- Instalación de extensiones para VScode (parte 1) 09 minClase1.5
- Instalación de extensiones para VScode (parte 2) 11 minClase1.6
- Instalando de Bootstrap usando un CDN 06 minClase1.7
- Instalando de Bootstrap usando los archivos compilados 07 minClase1.8
- Instalando de Bootstrap usando los archivos fuentes 10 minClase1.9
Módulo 2: Analizando lo nuevo de BOOTSTRAP 5
13- Soporte nativo para RTL (parte 1) 09 minClase2.1
- Soporte nativo para RTL (parte 2) 09 minClase2.2
- Integrando RFS (Responsive Font Sizes) 13 minClase2.3
- Integrando Bootstrap Icons (parte 1) 09 minClase2.4
- Integrando Bootstrap Icons (parte 2) 11 minClase2.5
- Bienvenido Breakpoint XXL (parte 1) 10 minClase2.6
- Bienvenido Breakpoint XXL (parte 2) 11 minClase2.7
- Bienvenido Breakpoint XXL (parte 3) 07 minClase2.8
- Las nuevas clases de espaciado de columnas (parte 1) 09 minClase2.9
- Las nuevas clases de espaciado de columnas (parte 2) 07 minClase2.10
- Entendiendo la nueva API de utilidades 08 minClase2.11
- Trabajando con la nueva API de utilidades 11 minClase2.12
- Las nuevas clases CSS que trae Bootstrap 5 09 minClase2.13
Módulo 3: Definiendo detalles antes de convertir
6- Instalando las Fuentes para el diseño 02 minClase3.1
- Gestionando el espacio de trabajo en Adobe Illustrator 07 minClase3.2
- Trabajando con la herramienta “Selección” y “Zoom” en Adobe Illustrator 10 minClase3.3
- Definiendo el patron de colores 10 minClase3.4
- Definiendo el tipo de fuente en Bootstrap 09 minClase3.5
- Definiendo del tamaño y color del texto 08 minClase3.6
Módulo 4: Creando el encabezado del sitio
29- Entendiendo la estructura del encabezado 07 minClase4.1
- Implementando el componente Navbar 11 minClase4.2
- Personalizando el componente Navbar 09 minClase4.3
- Personalizando los enlaces del Navbar 05 minClase4.4
- Integrando Bootstrap Icons en el Navbar 07 minClase4.5
- Integrando el enlace “Iniciar sesión” en el Navbar 05 minClase4.6
- Centrando los enlaces del Navbar 03 minClase4.7
- Creando el bloque “Bienvenidos” 04 minClase4.8
- Trabajando con las nuevas clases d-grid y gap 09 minClase4.9
- Creando columnas responsive con Bootstrap 06 minClase4.10
- Sobrescribiendo las variables SASS del Navbar 07 minClase4.11
- Sobrescribiendo las variables SASS del componente Button 09 minClase4.12
- Implementando las Media queries NATIVAS de Bootstrap 08 minClase4.13
- Exportando imágenes en Adobe Illustrator para la vista móvil 11 minClase4.14
- Exportando imágenes en Adobe Illustrator para la vista Escritorio 03 minClase4.15
- Integrando las imágenes de encabezado con CSS 07 minClase4.16
- Insertando un capa semi-transparente al encabezado 07 minClase4.17
- Implementando las nuevas UTILIDADES DE CENTRADO 05 minClase4.18
- Entendiendo el posicionamiento ABSOLUTO y RELATIVO 09 minClase4.19
- Entendiendo las nuevas UTILIDADES DE CENTRADO 09 minClase4.20
- Insertando el logo en el encabezado 05 minClase4.21
- Definiendo el tamaño del BOTON MOVIL 08 minClase4.22
- Cambiando el icono del BOTON MOVIL cuando esta activo 11 minClase4.23
- Personalizando el ICONO INGRESAR 04 minClase4.24
- Últimos detalles para la sección BIENVENIDOS 12 minClase4.25
- Creando una utilidad personalizada CSS “ORDEN DE CAPAS” 10 minClase4.26
- Implementando la utilidad CSS “ORDEN DE CAPAS” 03 minClase4.27
- Estilizando el MENU DESPLEGABLE 09 minClase4.28
- Trabajando con media-breakpoint-down() 10 minClase4.29
Módulo 5: Modulo 5 Creando la sección PLAN DE ACCIÓN
11- Creando el encabezado del PLAN DE ACCIÓN 10 minClase5.1
- Creando una linea divisoria REUTILIZABLE con CSS 09 minClase5.2
- Creando una linea divisoria REUTILIZABLE RESPONSIVE 04 minClase5.3
- Exportando iconos en formato SVG 05 minClase5.4
- Insertando las clases CSS para bordes 08 minClase5.5
- Insertando iconos en formato SVG 03 minClase5.6
- Insertando el contenido para cada PLAN DE ACCIÓN 06 minClase5.7
- Insertando el contenido para todos los PLANES DE ACCIÓN 08 minClase5.8
- Creando las columnas Responsive para los PLANES 03 minClase5.9
- Creando columnas con ROW-COLUMNS de Bootstrap 03 minClase5.10
- Creando sombras nativas de Bootstrap 06 minClase5.11
Módulo 6: Creando la sección TE AYUDAMOS
8- Creando la estructura de la sección TE AYUDAMOS 07 minClase6.1
- Trabajando con los INPUT GROUP 06 minClase6.2
- Exportando una imagen de fondo para la vista Movil 09 minClase6.3
- Exportando una imagen de fondo para la vista Escritorio 06 minClase6.4
- Creando una descripción Responsive 06 minClase6.5
- Diseñando el formulario para la vista Móvil 07 minClase6.6
- Diseñando el formulario para la vista Escritorio 04 minClase6.7
- Definiendo espaciados Responsive para la sección 03 minClase6.8
Módulo 7: Creando la sección PROYECTOS
8- Creando el encabezado de la sección PROYECTOS 05 minClase7.1
- Exportando imágenes de cada proyecto 03 minClase7.2
- Implementando el contenedor fluido de Bootstrap 02 minClase7.3
- Creando la galería para la vista Móvil 05 minClase7.4
- Creando las columnas para la vista Escritorio 03 minClase7.5
- Removiendo el espaciado entre columnas 02 minClase7.6
- Creando el efecto Hover de los proyectos (parte 1) 09 minClase7.7
- Creando el efecto Hover de los proyectos (parte 2) 11 minClase7.8
Módulo 8: Creando el PIE DE PÁGINA
8- Creando la estructura del pie de página 08 minClase8.1
- Creando listas nativas de Bootstrap 09 minClase8.2
- Creando los iconos para REDES SOCIALES 06 minClase8.3
- Estilizando los iconos para REDES SOCIALES 06 minClase8.4
- Creando las columnas del PIE DE PÁGINA 10 minClase8.5
- Columnas responsive para el PIE DE PáGINA 07 minClase8.6
- Optimizando el PIE DE PÁGINA 05 minClase8.7
- Creando los créditos del sitioClase8.8
Módulo 9: Retoques finales y despedida
4- Optimizando los archivos CSS de Bootstrap (parte 1) 09 minClase9.1
- Optimizando los archivos CSS de Bootstrap (parte 2) 10 minClase9.2
- Optimizando los archivos JS de Bootstrap 08 minClase9.3
- Creando un favicon AVANZADO 10 minClase9.4
Integrando Bootstrap Icons (parte 2)
El contenido de la lección esta vacío.
Anterior
Integrando Bootstrap Icons (parte 1)
Siguiente
Bienvenido Breakpoint XXL (parte 1)
Deja una respuesta
Lo siento, debes estar conectado para publicar un comentario.