Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen der Seite angezeigt.

--- informatik:css:css-lernpfad-box-modell [2018/10/15 23:19] – jonathan.pfeiffer
+++ informatik:css:css-lernpfad-box-modell [2018/10/16 09:32] – jonathan.pfeiffer
@@ Zeile 7: / Zeile 7: @@
 Alle Boxen sind nach einem bestimmten Schema aufgebaut; das Box-Modell genannt wird.\\
 Die Abbildung zeigt eine schematische Darstellung des Box-Modells.\\
+\\
 {{:informatik:css-box-modell.png?538|}}
@@ Zeile 89: / Zeile 90: @@
 <html>
 <iframe src="https://learningapps.org/watch?app=5706584" style="border:0px;width:100%;height:500px" webkitallowfullscreen="true" mozallowfullscreen="true"></iframe>
-<tabbox Gesamtbreite>
 </html>
+<tabbox #4>
+<WRAP center round todo 80%>
+  * Öffne das Thimble Projekt. https://thimbleprojects.org/jonathanpf/561117
+  * Verändere die Werte bei margin und padding. Spiele mit den Werten und beobachte die Veränderungen.
+  * Bekommen ein Gefühl für das Box-Modell.
+</WRAP>
+<tabbox Gesamtbreite>
 Auf den ersten Blick ungewöhnlich ist die Berechnung der **Gesamtbreite** einer Box. ''width'' heißt zwar »Breite«, damit ist aber wie erwähnt nicht die Gesamtbreite der Box gemeint, sondern die Breite des
@@ Zeile 116: / Zeile 127: @@
 | Gesamtbreite der Box    | 780px  |
-<tabbox #4>
+<tabbox #5>
 <html>
 <iframe src="https://learningapps.org/watch?app=5706469" style="border:0px;width:100%;height:500px" webkitallowfullscreen="true" mozallowfullscreen="true"></iframe>
 </html>
-<tabbox #5>
+<tabbox #6>
 <WRAP center round important 60%>
 Um die unten angeführte Learningapp bearbeiten zu können, musst du folgenden Link aufrufen: [[https://thimbleprojects.org/jonathanpf/560287]]
@@ Zeile 130: / Zeile 141: @@
 </html>
 \\
-<tabbox #6>
+<tabbox #7>
-**Wiederholung zu CSS**
+**Wiederholung zu CSS**\\
 \\
 <html>