HTML y CSS Moderno es un curso online de Cursalo en español para aprender con una ruta estructurada de módulos, lecciones y práctica. La página reúne el objetivo del curso, instructor, duración, contenido, preguntas frecuentes y opción de inscripción, para que estudiantes y motores de respuesta puedan entender rápidamente qué se aprende, para quién sirve y cómo empezar.
HTML y CSS Moderno
Instructora
Acerca de este curso
Este curso de HTML y CSS Moderno fue reforzado para funcionar como una ruta de aprendizaje seria, no como una colección de apuntes cortos. La idea es que el estudiante entienda los conceptos centrales, pero también sepa cuándo aplicarlos, qué errores evitar y cómo convertirlos en decisiones concretas.
A lo largo de los módulos se trabaja con explicaciones claras, ejemplos, criterios prácticos, ejercicios y checklists. El enfoque prioriza aprendizaje útil: menos teoría decorativa y más pasos que una persona pueda llevar a su trabajo, emprendimiento, estudio o proyecto digital.
La guía de Mariana López acompaña el recorrido con una mirada aplicada: definir objetivos, practicar con entregables pequeños, revisar resultados y mejorar. Al final, el estudiante debería tener una base ordenada, vocabulario claro y un plan realista para seguir avanzando sin depender de recetas mágicas.
Mariana López
Resumen del temario
Este curso incluye 4 modulos, 12 lecciones y 3:30 horas de materiales.
Lección: Introducción a HTML y estructura básica body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; line-height: 1.7; max-width: 900px; margin: 0 auto; padding: 20px; color: #333; background-color: #f9f9f9; } h1 { color: #2c3e50; border-bottom: 3px solid #3498db; padding-bottom: 10px; } h2 { color: #2980b9; margin-top: 30px; padding-bottom: 5px; border-bottom: 1px solid #ddd; } h3 { color: #16a085; } p { margin-bottom: 15px; } pre { background-color: #2d2d2d; color: #f8f8f2; pa
Lección: Elementos de texto y encabezados - Fundamentos de HTML5 body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; line-height: 1.6; color: #333; max-width: 900px; margin: 0 auto; padding: 20px; background-color: #f9f9f9; } h1 { color: #2c3e50; border-bottom: 3px solid #3498db; padding-bottom: 10px; } h2 { color: #2980b9; margin-top: 30px; padding-bottom: 5px; border-bottom: 1px solid #ddd; } h3 { color: #16a085; } p { margin-bottom: 15px; } pre { background-color: #2d3a4b; co
Lección: Enlaces, imágenes y rutas - Fundamentos de HTML5 body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; line-height: 1.6; color: #333; max-width: 900px; margin: 0 auto; padding: 20px; background-color: #f9f9f9; } h2 { color: #2c3e50; border-bottom: 2px solid #3498db; padding-bottom: 10px; margin-top: 40px; } h3 { color: #2980b9; margin-top: 25px; } p { margin-bottom: 15px; } pre { background-color: #2d3a4b; color: #ecf0f1; padding: 15px; border-radius: 5px; overflow-x: aut
Tipo de lección: QuizEvaluación del móduloResponde estas preguntas para comprobar que puedes aplicar los criterios principales del módulo.
Lección: Introducción a CSS y conexión con HTML body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; line-height: 1.6; color: #333; max-width: 900px; margin: 0 auto; padding: 20px; background-color: #f9f9f9; } h2 { color: #2c3e50; border-bottom: 2px solid #3498db; padding-bottom: 10px; margin-top: 40px; } h3 { color: #2980b9; margin-top: 25px; } p { margin-bottom: 15px; } pre { background-color: #2d3a4b; color: #e0e0e0; padding: 15px; border-radius: 5px; overflow-x: auto; border-
Lección: Selectores, colores y tipografía en CSS body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; line-height: 1.6; color: #333; max-width: 1200px; margin: 0 auto; padding: 20px; background-color: #f9f9f9; } h2 { color: #2c3e50; border-bottom: 2px solid #3498db; padding-bottom: 10px; margin-top: 40px; } h3 { color: #2980b9; margin-top: 25px; } p { margin-bottom: 15px; } pre { background-color: #2d3a4b; color: #ecf0f1; padding: 20px; border-radius: 8px; overflow-x: auto; borde
Lección: Modelo de Caja, Padding, Margin y Border /* Estilos mínimos para legibilidad de la lección */ body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; line-height: 1.6; color: #333; max-width: 900px; margin: 0 auto; padding: 20px; background-color: #f9f9f9; } h2 { color: #2c3e50; border-bottom: 2px solid #3498db; padding-bottom: 10px; margin-top: 40px; } h3 { color: #2980b9; margin-top: 25px; } p { margin-bottom: 15px; } pre { background-color: #2d3a4b; color: #ecf0f1; paddi
Tipo de lección: QuizEvaluación del móduloResponde estas preguntas para comprobar que puedes aplicar los criterios principales del módulo.
Lección: Flexbox para layouts flexibles - HTML y CSS Moderno body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; line-height: 1.6; color: #333; max-width: 1200px; margin: 0 auto; padding: 20px; background-color: #f9f9f9; } h2 { color: #2c3e50; border-bottom: 3px solid #3498db; padding-bottom: 10px; margin-top: 40px; } h3 { color: #2980b9; margin-top: 25px; } p { margin-bottom: 15px; text-align: justify; } pre { background-color: #2d3a4b; color: #e0e0e0; padding: 20px; border-rad
Introducción a CSS GridCSS Grid Layout representa un sistema de diseño bidimensional revolucionario que transformó completamente la manera en que construimos interfaces web. A diferencia de Flexbox, que trabaja en una sola dirección, Grid nos permite controlar simultáneamente filas y columnas, abriendo un mundo de posibilidades para crear layouts complejos con una elegancia y simplicidad que antes eran impensables.En esta lección exploraremos las técnicas avanzadas que te permitirán dominar CSS
En el panorama actual del desarrollo web, crear sitios que se adapten a cualquier dispositivo dejó de ser una opción para convertirse en una necesidad imperativa. Los usuarios acceden a la web desde teléfonos inteligentes, tabletas, computadoras de escritorio e incluso televisores inteligentes, cada uno con diferentes tamaños de pantalla y resoluciones. El diseño responsivo es el enfoque que nos permite crear sitios web flexibles que responden y se adaptan a estas diversas condiciones de visuali
Tipo de lección: QuizEvaluación del móduloResponde estas preguntas para comprobar que puedes aplicar los criterios principales del módulo.
Responder al comentario