Übungen / Aufgaben zu HTML/CSS
1 Lösung
Formular Adressfeld inkl. eMail
Zu erstellen ist ein Adressfeld mit der Auswahl der Anrede. Eingabe des Vornamens und des Nachnamens erfolgt genau wie die Strasse inkl. Hausnummer, PLZ und Ort in Textfeldern. Unten soll die Eingabe der eMail erfolgen inkl. einer Vorschau wie die Eingabe zu erfolgen hat. Die Felder Nachname, Postleitzahl und eMail sollen Pflichtfelder sein, wobei die Postleitzahl aus 5 Zeichen bestehen muss!
Optional könnt Ihr einen Rahmen um die Felder setzen, der z. B. mit Adressfeld beschrieben ist.
Zur besseren Erklärung ein Bild der möglichen Lösung!
Viel Spass!
Optional könnt Ihr einen Rahmen um die Felder setzen, der z. B. mit Adressfeld beschrieben ist.
Zur besseren Erklärung ein Bild der möglichen Lösung!
Viel Spass!
1 Lösung
Erstellung einer Tabelle
Erstelle eine Tabelle mit mindestens 5 Spalten und mit mindestens 4 Zeilen. Die Tabelle soll einen Bereich für den Head und ein Bereich für den Footer aufweisen. Die einzelnen Bereiche sollen farblich hervorgehoben sein, ebenfalls die Zeilen in dem Tabellen Body.
Zur weiteren Erklärung findet Ihr im Anhang eine mögliche Lösung.
Denkt an den internen Stylebereich!
Viel Spass!
Zur weiteren Erklärung findet Ihr im Anhang eine mögliche Lösung.
Denkt an den internen Stylebereich!
Viel Spass!
1 Lösung
Durchschimmernder Text
Schreibe einen Text mit einem geschlossenen Zeilenfall (Blocksatz) mit einem umliegenden roten Rahmen. Der Text hat einen Abstand vom Rahmen von ca. 10 Pixel. In diesem Text sind Wörter unterstrichen, fett und kursiv geschrieben. Lege auf den Text eine hellblaue Kachel, durch diese Kachel schimmert der Text durch.
Zum besseren Verständnis ein Bild im Anhang!
Es ist darauf zu achten, das das Stylesheet in dem HTML eingebettet ist!
Viel Spaß!
Zum besseren Verständnis ein Bild im Anhang!
Es ist darauf zu achten, das das Stylesheet in dem HTML eingebettet ist!
Viel Spaß!
0 Lösungen
Gestaltung einer Kachelansicht
Gestalte eine Webseite mit 3 Rechtecken und 6 Quadraten unterschiedlicher Farbe auf einer Webseite. Die einzelnen Kacheln sollen untereinander einen Pixelabstand von 10px aufweisen. Jede einzelne Kachel hat einen Rahmen von 1 Pixel und abgerundete Ecken.
Ein mögliches Resultat habe ich als Ansicht zur weiteren Erklärung angehängt!
Es ist darauf zu achten, das das Stylesheet innerhalb des HTML Dokumentes wiederzufinden ist!
Viel Spaß!
Ein mögliches Resultat habe ich als Ansicht zur weiteren Erklärung angehängt!
Es ist darauf zu achten, das das Stylesheet innerhalb des HTML Dokumentes wiederzufinden ist!
Viel Spaß!
1 Lösung
Hintergrund- und Schriftfarbe
Es ist eine Webseite mit 4 Absätzen und jeweils einer unterstrichenen Überschrift zu erstellen. Die Hintergrundfarbe der Absätze soll von schwarz nach weiß abwechseln. Die Schriftfarbe soll von weiß nach schwarz abwechseln. Bei weißer Schrift soll die Schriftart "Arial" verwendet werden, bei schwarzer Schrift "Verdana" oder eine beliebig Andere.
Anhang angefügt!!!
Es ist darauf zu achten, das das CSS Stylesheet in das HTML eingebettet ist!
Viel Spaß!
Anhang angefügt!!!
Es ist darauf zu achten, das das CSS Stylesheet in das HTML eingebettet ist!
Viel Spaß!
0 Lösungen
Simples Spiel mit HTML und CSS ohne Javascript
Was für ein Spiel Programmiert wird ist egal, Hauptsache es wird nur HTML und CSS verwendet. Kein Javascript!
Als kleiner Hilfe hier ein Tipp:
Nehmt für jede Figur einen neuen Div-Block und verändert die Figur dann per CSS
Als kleiner Hilfe hier ein Tipp:
Nehmt für jede Figur einen neuen Div-Block und verändert die Figur dann per CSS
2 Lösungen
Einfügen von Bilder in eine Website
Gesucht werden zwei Möglichkeit Bilder in eine Website einzubinden.
Einmal gespeicherte Bild auf eigenem Server und Bild von anderen Websiten.
Einmal gespeicherte Bild auf eigenem Server und Bild von anderen Websiten.
3 Lösungen
HTML Grundlagen: Ein Video von Youtube in eine Website einbinden
5 Lösungen
HTML Grundlagen: Button
Schreibt einen Code der einen Button zur Seite hinzufügt.
Zusatzaufgabe: Wenn man den Button anklickt wird die Seite neu geladen
Zusatzaufgabe: Wenn man den Button anklickt wird die Seite neu geladen
4 Lösungen
HTML Grundlagen: Liste
Die Aufgabe Lautet:
Einen HTML Code zuschreiben der, der Seite eine Liste Hinzufügt
Einen HTML Code zuschreiben der, der Seite eine Liste Hinzufügt
4 Lösungen
HTML Grundlagen: Farbiger Hintergrund
Da es hier fast nichts bei HTML gibt beginne ich eine kleine HTML Anfängerreihe.
Die Aufgabe ist:
Einen HTML Code zu schreiben der, der Seite einen Schwarzen Hintergrund verpasst.
Die Aufgabe ist:
Einen HTML Code zu schreiben der, der Seite einen Schwarzen Hintergrund verpasst.
0 Lösungen
SVG Darstellung des OSI Schichten Modells
Guten Tag,
heute geht es an die Aufgabe, ein bisschen mit SVG zu spielen.
Gewünscht ist ( wie hoffentlich in der Zip Datei im Anhang ) eine ungefähre Darstellung des OSI Schichten Modells.
Zum OSI Modell an sich: Es ist sehr wichtig für die Informatiker mit Spezialisierung auf Systemintegration zu verstehen, wie die verschiedenen Geräte miteinander kommunizieren. Hierfür gibt es verschiedene Protokolle, die im OSI Modell verallgemeinert beschrieben werden.
Falls weitere Interesse zu diesem Thema besteht, oder die Zip Datei mit der SVG nicht vorhanden ist, hier der Link zum Wikipedia Beitrag: https://de.wikipedia.org/wiki/OSI-Modell
Gutes Gelingen!:)
heute geht es an die Aufgabe, ein bisschen mit SVG zu spielen.
Gewünscht ist ( wie hoffentlich in der Zip Datei im Anhang ) eine ungefähre Darstellung des OSI Schichten Modells.
Zum OSI Modell an sich: Es ist sehr wichtig für die Informatiker mit Spezialisierung auf Systemintegration zu verstehen, wie die verschiedenen Geräte miteinander kommunizieren. Hierfür gibt es verschiedene Protokolle, die im OSI Modell verallgemeinert beschrieben werden.
Falls weitere Interesse zu diesem Thema besteht, oder die Zip Datei mit der SVG nicht vorhanden ist, hier der Link zum Wikipedia Beitrag: https://de.wikipedia.org/wiki/OSI-Modell
Gutes Gelingen!:)