Unterschiede
Hier werden die Unterschiede zwischen zwei Versionen angezeigt.
| Beide Seiten der vorigen Revision Vorhergehende Überarbeitung Nächste Überarbeitung | Vorhergehende Überarbeitung | ||
| de:modul:m287:learningunits:lu00:12 [2026/06/22 07:47] – [LU04 - Display] vdemir | de:modul:m287:learningunits:lu00:12 [2026/06/30 12:34] (aktuell) – [LU05 - Responsive Webdesign (RWD)] vdemir | ||
|---|---|---|---|
| Zeile 4: | Zeile 4: | ||
| ^# | ^# | ||
| - | ^1.1 |Ich kenne die Syntax und seine Bestandteile einer URL. | | + | ^1.1 |Ich kenne die Syntax und seine Bestandteile einer //URL//. | |
| - | ^1.2 |Ich kann mindestens drei verschiedene Protokolle aufzählen, die in einer URL verwendet werden können. | | + | ^1.2 |Ich kann mindestens drei verschiedene |
| - | ^1.3 |Ich kenne den unterschied zwischen einer Referenzierung mit absoluter und relativer Pfadangabe. | | + | ^1.3 |Ich kenne den unterschied zwischen einer //Referenzierung mit absoluter// und //relativer Pfadangabe//. | |
| - | ^1.4 |Ich kann Referenzierungen mit absoluter und relativer Pfadangabe gezielt in HTML-Dokumenten anwenden/einsetzen. | | + | |
| ===== LU03 - Box Modell ===== | ===== LU03 - Box Modell ===== | ||
| ^# | ^# | ||
| - | ^3.1 |Ich kenne den Unterschied zwischen dem klassischen und dem neuen Box-Modell. | + | ^3.1 |Ich kenne den Unterschied zwischen dem //klassischen// und dem //neuen Box-Modell//. | |
| - | ^3.2 |Ich kann den Vorteil des neuen Box-Modells in eigenen Worten angeben. | | + | ^3.2 |Ich kann den Vorteil des //neuen Box-Modells// in eigenen Worten angeben. | |
| - | ^3.3 |Ich kann Inhalte | + | ^3.3 |Ich kann den Begriff // |
| - | ^3.4 |Ich kann den Begriff zusammenfallende (vertikale) Aussenabstände (Collapsing Margins) | + | ^3.4 |Ich kann den Begriff |
| ===== LU04 - Display ===== | ===== LU04 - Display ===== | ||
| Zeile 23: | Zeile 23: | ||
| ^4.2 |Ich kenne den Aufbau eines //Flexbox Layouts// (Container, Items) und deren Eigenschaften. | | ^4.2 |Ich kenne den Aufbau eines //Flexbox Layouts// (Container, Items) und deren Eigenschaften. | | ||
| ^4.3 |Ich kenne den Aufbau eines //Grid Layouts// (Container, Zeilen, Spalten, Zellen). | | ^4.3 |Ich kenne den Aufbau eines //Grid Layouts// (Container, Zeilen, Spalten, Zellen). | | ||
| - | ^4.4 |Ich kann die Standardwerte der Eigenschaft //display// unterscheiden und den Unterschied in eigenen Worten erklären. | | + | ^4.4 |Ich verstehe den Unterschied zwischen //Flexbox// und //Grid Layout//. | |
| - | ^4.5 |Ich verstehe den Unterschied zwischen //Flexbox// und //Grid Layout//. | | + | ^4.5 |Ich kann ein //Flexbox Layout// syntaktisch und semantisch korrekt erstellen. | |
| - | ^4.6 |Ich kann ein //Flexbox Layout// syntaktisch und semantisch korrekt erstellen | + | |
| - | ^4.7 |Ich kann ein //Grid Layout// syntaktisch und semantisch korrekt erstellen und strukturieren. | | + | |
| ===== LU05 - Responsive Webdesign (RWD) ===== | ===== LU05 - Responsive Webdesign (RWD) ===== | ||
| Zeile 35: | Zeile 34: | ||
| ^5.3 |Ich kann den Begriff Viewport definieren und dessen Bedeutung für die Darstellung einer Webseite auf verschiedenen Endgeräten erläutern. | | ^5.3 |Ich kann den Begriff Viewport definieren und dessen Bedeutung für die Darstellung einer Webseite auf verschiedenen Endgeräten erläutern. | | ||
| ^5.4 |Ich kann die aktuell gültigen CSS-Medientypen //(all, screen, print, speech)// aufzählen und deren Verwendungszweck beschreiben. | | ^5.4 |Ich kann die aktuell gültigen CSS-Medientypen //(all, screen, print, speech)// aufzählen und deren Verwendungszweck beschreiben. | | ||
| - | ^5.5 |Ich kann das media-Attribut im <link>- oder < | + | ^5.5 |Ich kann das media-Attribut im //link//, // |
| ^5.6 |Ich kann veraltete (deprecated) Medientypen wie // | ^5.6 |Ich kann veraltete (deprecated) Medientypen wie // | ||
| - | ^5.7 |Ich kenne die drei Varianten, um Media Queries in ein HTML-Dokument einzubinden (//< | + | ^5.7 |Ich kann den Begriff // |
| - | ^5.8 |Ich kann den Begriff // | + | ^5.8 |Ich kann Media Queries mit Breakpoints und // |
| - | ^5.9 |Ich kann Media Queries mit Breakpoints und // | + | ^5.9 |Ich kenne die wichtigsten Medienmerkmale (width, height, orientation, |
| - | ^5.10 |Ich kenne die wichtigsten Medienmerkmale (width, height, orientation, | + | |
| - | ^5.11 |Ich kann den Unterschied zwischen width/ | + | |
| - | ^5.12 |Ich kann Medienmerkmale mit den Präfixen min- und max- sowie dem Attribut orientation gezielt in Media Queries einsetzen. | | + | |
| Zeile 49: | Zeile 46: | ||
| ^# | ^# | ||
| ^6.1 |Ich kenne die zwei Varianten, um Bootstrap in ein HTML-Dokument einzubinden (Download und CDN), und deren jeweilige Vor- und Nachteile. | | ^6.1 |Ich kenne die zwei Varianten, um Bootstrap in ein HTML-Dokument einzubinden (Download und CDN), und deren jeweilige Vor- und Nachteile. | | ||
| - | ^6.2 |Ich kann erklären, wofür die < | + | ^6.2 |Ich kann erklären, wofür die < |
| - | ^6.3 |Ich kann Bootstrap korrekt in ein bestehendes | + | ^6.3 |Ich kann erklären was // |
| - | ^6.4 |Ich kenne den Unterschied zwischen .container und .container-fluid sowie das 12-Spalten-Raster von Bootstrap. | | + | ^6.4 |Ich kenne den Unterschied zwischen |
| - | ^6.5 |Ich kann erklären, wann ich .container oder .container-fluid einsetze und welchem HTML-Element ich die Container-Klasse sinnvoll zuordne. | | + | ^6.5 |Ich kann ein responsives Spaltenlayout mit den Bootstrap-Klassen |
| - | ^6.6 |Ich kann ein responsives Spaltenlayout mit den Bootstrap-Klassen container, row und col- syntaktisch und semantisch korrekt erstellen. | | + | col-// syntaktisch und semantisch korrekt erstellen. | |