css tutorial exercises course

Tutorial de ejercicios CSS en 4Geeks Academy

¡Hola! Soy Alejandro Sánchez @Alesanchezr, ¡realmente emocionado de tenerte aquí! ? ? Aprender a codificar es difícil; ¡Necesitas entrenar! DM me en Twitter si tienes alguna pregunta.

Estas instrucciones están disponibles en ?? Español ??

Aprenderás los siguientes conceptos:

1. Cómo aplicar CSS a su sitio web de 3 maneras diferentes: en línea, agrupándolos dentro de una etiqueta <style> o utilizando una hoja de estilo externo <link> .

2. Selección de elementos HTML de su sitio web para aplicar los estilos.

3. Aplicar reglas CSS (estilos) a esos elementos.

4. Use las reglas CSS más populares.

5. Aprenda los trucos CSS más populares.

Antes de comenzar ... otros tutoriales relacionados

1. Aprender html
2. Aprenda formularios HTML5
3. Aprende CSS ← ¡Estás aquí ahora!
4. Aprender diseños de CSS
5. Aprender bootstrap

¡Selección completa de ejercicios de CSS autogradados, para cualquier persona interesada en aprender CSS!

Instalación de un clic (recomendado):

Puede abrir estos ejercicios en solo unos segundos haciendo clic: Abrir en espacios de códigos (recomendados) o abrir en GitPod.

Una vez que tenga Vscode, los ejercicios LearnPack deben comenzar automáticamente. Si los ejercicios no se ejecutan automáticamente, puede intentar escribir en su terminal: $ learnpack start

Instalación manual

Clone el repositorio en su entorno local y siga los pasos a continuación:

1. Instale Learnpack, el administrador de paquetes para tutoriales de aprendizaje y el complemento del compilador HTML para Learnpack; Asegúrese de tener también Node.js 14+:

$ npm i learnpack -g
$ learnpack plugins:install learnpack-html

2. Descargar los ejercicios

$ learnpack install css-tutorial-exercises-course

Nota: Una vez que termine de descargar, deberá cd en la carpeta de ejercicios que contiene todos los ejercicios.

3. Inicie el tutorial/ejercicios ejecutando el siguiente comando al mismo nivel donde su archivo Learn.json es:

$ npm i [email protected] -g
$ learnpack start

¿Cómo se organizan los ejercicios?

Cada ejercicio es una pequeña aplicación React que contiene los siguientes archivos:

1. index.html: todos los sitios web y ejercicios comienzan desde index.html.
2. styles.css: su código CSS va aquí, algunos ejercicios le harán actualizar este archivo.
3. ReadMe.md: contiene instrucciones de ejercicio.
4. Test.js: no tiene que abrir este archivo, contiene el script de prueba para el ejercicio.

Nota: Los ejercicios tienen una calificación automática, pero es muy rígido y estricto, mi recomendación es no tomar las pruebas demasiado serias y usarlas solo como sugerencia o puede frustrarse.

Colaboradores

Gracias a estas maravillosas personas (Key Emoji):

1. Alejandro Sánchez (Alesanchezr), Contribución: (Coder) (Idea)?, (Pruebas de ejecución) ️ , (Pull-Request-Review)? (Tutorial de ejecución) ✅ (documentación)

2. Paolo (PLUCODEV), Contribución: (Informes de errores)?, Contribución: (Coder), (Traducción)?

3. Daniel Machota (@d4rkm0nst3r), contribución: (tutorial) ✅, ¿traducción?

Este y muchos otros ejercicios son construidos por estudiantes como parte del Campamento de codificación de la Academia 4Geeks por Alejandro Sánchez y muchos otros colaboradores. Obtenga más información sobre nuestro curso completo de desarrolladores de pila y Data Science Bootcamp.