css tutorial exercises course

CSS Übungen Tutorial an der 4Geeks Academy

Hallo! Ich bin Alejandro Sanchez @alalanchezr, sehr aufgeregt, dich hier zu haben! ? ? Zu lernen ist schwer; Du brauchst Coaching! DM mich auf Twitter, wenn Sie Fragen haben.

Estas lehrtiere están Disponibles en? Español ??

Sie werden die folgenden Konzepte lernen:

1. So wenden Sie CSS auf 3 verschiedene Arten auf Ihre Website an: Inline, indem Sie sie in einem <style> -Tag oder mithilfe eines externen Stylesheet <link> zusammenschließen.

2. Auswählen von HTML -Elementen von Ihrer Website, um die Stile anzuwenden.

3. Wenden Sie CSS -Regeln (Stile) auf diese Elemente an.

4. Verwenden Sie die beliebtesten CSS -Regeln.

5. Lernen Sie die beliebtesten CSS -Tricks.

Bevor wir anfangen ... andere verwandte Tutorials

1. Lerne HTML
2. Lernen Sie HTML5 -Formulare
3. Lernen Sie CSS ← Sie sind jetzt hier!
4. Lernen Sie CSS -Layouts
5. Lernen Sie Bootstrap

Komplette Auswahl an automatischen CSS -Übungen für alle, die an CSS lernen möchten!

Eine Klick -Installation (empfohlen):

Sie können diese Übungen in nur wenigen Sekunden öffnen, indem Sie klicken: Öffnen Sie in den Codenspaces (empfohlen) oder in Gitpod.

Sobald Sie VSCODE öffnen, sollten die Learnpack -Übungen automatisch beginnen. Wenn Übungen nicht automatisch ausgeführt werden, können Sie versuchen, Ihr Terminal einzugeben: $ learnpack start

Manuelle Installation

Klonen Sie das Repository in Ihrer lokalen Umgebung und befolgen Sie die folgenden Schritte:

1. Installieren Sie LearnPack, den Paketmanager für Lern ​​-Tutorials und das HTML -Compiler -Plugin für LearnPack; Stellen Sie sicher, dass Sie auch Node.js 14+ haben:

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

2. Laden Sie die Übungen herunter

$ learnpack install css-tutorial-exercises-course

Hinweis: Sobald Sie das Herunterladen fertiggestellt haben, müssen Sie cd in den Ordner Übungen benötigen, der alle Übungen enthält.

3. Starten Sie das Tutorial/die Übungen, indem Sie den folgenden Befehl auf derselben Ebene ausführen, in der Ihre Datei "Learn.json" lautet:

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

Wie sind die Übungen organisiert?

Jede Übung ist eine kleine Reaktionsanwendung mit folgenden Dateien:

1. Index.html: Alle Websites und Übungen beginnen aus dem Index.html.
2. styles.css: Ihr CSS -Code geht hier, einige Übungen werden Sie diese Datei aktualisieren.
3. Readme.md: Enthält Übungsanweisungen.
4. test.js: Sie müssen diese Datei nicht öffnen, es enthält das Testskript für die Übung.

Hinweis: Die Übungen haben eine automatische Einstufung, aber es ist sehr starr und streng. Meine Empfehlung ist, die Tests nicht zu schwerwiegend zu machen und sie nur als Vorschlag zu verwenden, oder Sie können frustriert werden.

Mitwirkende

Vielen Dank an diese wunderbaren Menschen (Emoji -Schlüssel):

1. Alejandro Sanchez (Alesanchezr), Beitrag: (Codierer) (Idee)?, (Run-Tests) Euen , (Pull-Request-Review)? (Run-Tutorial) ✅ (Dokumentation)

2. Paolo (Plucodev), Beitrag: (Fehlerberichte)?, Beitrag: (Codierer), (Übersetzung)?

3. Daniel Machota (@d4rkm0nst3r), Beitrag: (Run-Tutorial) ✅, Übersetzung?

Diese und viele andere Übungen werden von Studenten im Rahmen der 4Geeks Academy -Coding -Bootcamp von Alejandro Sánchez und vielen anderen Mitwirkenden erstellt. Erfahren Sie mehr über unseren vollständigen Stack -Entwicklerkurs und Data Science Bootcamp.