From e8fc39487c67f3b75e676f88adafb13a1680ec4e Mon Sep 17 00:00:00 2001 From: Daniel Spittank Date: Tue, 11 Jan 2022 02:45:05 +0100 Subject: [PATCH] =?UTF-8?q?Aufgabe=20hinzugef=C3=BCgt.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- aufgabe.html | 185 +++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 185 insertions(+) create mode 100644 aufgabe.html diff --git a/aufgabe.html b/aufgabe.html new file mode 100644 index 0000000..454915c --- /dev/null +++ b/aufgabe.html @@ -0,0 +1,185 @@ + + + + + HTML-Projektaufgabe + + + +
+

Projektaufgabe HTML

+ +

Aufteilung des Projekts

+

Phase 0

+
+
Wann?
+
bis zum 23.12.2021
+
Was?
+
Einführung ins Thema, Grundstruktur, einfaches CSS
+
Wer?
+
Der gesamte Kurs
+
Bewertung?
+
SoMi
+
+ +

Phase 1

+
+
Wann?
+
bis zum 16.01.2022, 19 Uhr
+
Was?
+
Erstellung einer eigenen Webseite, Aufgabe siehe unten
+
Wer?
+
Jede(r) für sich
+
Bewertung?
+
Kursarbeit
+
+ +

Phase 2

+
+
Wann?
+
bis ca. Ende Februar
+
Was?
+
Erweitere Strukturen, Gestaltung und Programmierung
+
Wer?
+
Der gesamte Kurs / Gruppen
+
Bewertung?
+
SoMi (Präsentation)
+
+ +

Aufgabe für Phase 1

+

Erstelle eine einfache Webseite, zu einem frei gewählten Thema, die die folgenden Anforderungen erfüllt.

+ + +

Kurze Wiederholung

+

Die Grundstruktur

+ Die Grundstruktur einer HTML-Datei findet ihr im Verzeichnis "grundstruktur" unter dem Namen "index.html". + +

Absätze

+ 
<p>Ein Text in einem Absatz.</p>
+ +

Überschriften

+ Es gibt sechs verschiedene Überschriftenlevel von h1 bis h6. Dabei ist h1 die höchste (größte) + und h6 die niedrigste (kleinste). + 
<h1>Text</h1>
+ +

Textformat

+ Kursiv + 
<em>Text</em>
+ + Fett + 
<strong>Text</strong>
+ + Unterstrichen + 
<u>Text</u>
+ + Fließtext für CSS-Stil + 
<span>Text</span>
+ + Block für CSS-Stil + 
<div>Text</div>
+ +

Listen

+ Es gibt + und +
    +
  1. sortierte Listen (ol, mit Nummern). + 
    +<ol>
+    <li>erster</li>
+    <li>zweiter</li>
+    <li>dritter</li>
+</ol>
    2. +
+ +

Bilder

+ + Bilder fügt man mit dem Image-Tag (img) ein. Mit dem Attribut "src" gibt man die Quelle an. Das kann nur der Dateiname sein, wenn die Datei im selben Verzeichnis liegt, ein vollständiger Pfad, z.B. bilder/fotos/meinfoto.jpg, oder eine Internetadresse. + + 
<img src="apfelmus.jpg" alt="Ein beschreibender Text, der statt dem Bild angezeigt werden kann." />
+ +

+ CSS +

+ Cascading Style Sheets stehen in einem Style-Tag im Kopfbereich (head) des Dokuments. Sie werden durch den Bezeichner des zu formatierenden Elements und einige Formatierungsanweisungen in geschweiften Klammern angegeben. Beispiel: +
+<style>
+    div.pinkeBox {
+        width: 100px;
+        height: 100px;
+        background-color: pink;
+        border-style: solid;
+        border-color: purple;
+        border-width: 5px;
+        border-radius: 10px;
+    }
+</style>
+
+…
+
+<div class="pinkeBox">
+
+</div>
+
+ +
+ +
+ +
+ + +