Hilfe:Mehrspaltenlayout: Unterschied zwischen den Versionen
(angelegt) Markierung: 2017-Quelltext-Bearbeitung |
(Vorlage "NSpalten" entfernt, da nicht vorhanden) Markierung: 2017-Quelltext-Bearbeitung |
||
(4 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt) | |||
Zeile 1: | Zeile 1: | ||
{{Hilfe Navigation}} | {{Hilfe Navigation}} | ||
==Tabellen== | ==Tabellen== | ||
Der Einsatz von Tabellen | Der Einsatz von Tabellen im Grundschullernportal ist möglich und wird im ZUM-Wiki auf [https://wiki.zum.de/wiki/Hilfe:Tabellen Hilfe:Tabellen] ausführlich erklärt. | ||
{{Box|Achtung| | {{Box|Achtung| | ||
Zeile 9: | Zeile 10: | ||
Es gibt Vorlagen für ein Mehrspalten-Layout auf großen Bildschirmen. Die Spalten ordnen sich bei schmalem Display, aber auch bei geringer Auflösung (z.B. am Beamer), untereinander an. | Es gibt Vorlagen für ein Mehrspalten-Layout auf großen Bildschirmen. Die Spalten ordnen sich bei schmalem Display, aber auch bei geringer Auflösung (z.B. am Beamer), untereinander an. | ||
===2 | ===2 Spalten=== | ||
[[Vorlage:2Spalten]] | Nähere Informationen und weitere Features findet man auf der Vorlagenseite unter: [[Vorlage:2Spalten]] | ||
====Das sieht man:==== | |||
Die Hintergrundfarben dienen nur der Veranschaulichung. | Die Hintergrundfarben dienen nur der Veranschaulichung. | ||
{{Vorlage:2Spalten | {{Vorlage:2Spalten | ||
|{{Box-spezial | Titel = Spalte 1 | Inhalt = |Rahmen = 0| Hintergrund = {{Farbe | primär | 1}} }} | |{{Box-spezial | Titel = Spalte 1 | Inhalt = |Rahmen = 0| Hintergrund = {{Farbe | primär | 1}} }} | ||
|{{Box-spezial | Titel = Spalte 2 | Inhalt = |Rahmen = 0| Hintergrund = {{Farbe | sekundär-links | 1}}}} | |{{Box-spezial | Titel = Spalte 2 | Inhalt = |Rahmen = 0| Hintergrund = {{Farbe | sekundär-links | 1}}}} | ||
}} | }} | ||
====Das schreibt man:==== | |||
<pre>{{2Spalten| | |||
Spalte 1 | Spalte 1 | ||
| | | | ||
Spalte 2 | Spalte 2 | ||
}} | }} | ||
</ | </pre> | ||
===3 | ===3 Spalten=== | ||
Nähere Informationen und weitere Features findet man auf der Vorlagenseite unter: [[Vorlage:3Spalten]] | |||
====Das sieht man:==== | |||
Die Hintergrundfarben dienen nur der Veranschaulichung. | |||
{{Vorlage:3Spalten | {{Vorlage:3Spalten | ||
|{{Box-spezial | Titel = Spalte 1 | Inhalt = |Rahmen = 0| Hintergrund = {{Farbe | primär | 1}} }} | |{{Box-spezial | Titel = Spalte 1 | Inhalt = |Rahmen = 0| Hintergrund = {{Farbe | primär | 1}} }} | ||
Zeile 40: | Zeile 38: | ||
}} | }} | ||
====Das schreibt man:==== | |||
<pre>{{3Spalten| | |||
Spalte 1 | Spalte 1 | ||
| | | | ||
Zeile 49: | Zeile 47: | ||
Spalte 3 | Spalte 3 | ||
}} | }} | ||
</ | </pre> | ||
===HTML-Markup=== | ===HTML-Markup=== | ||
Als Basis gibt es -1, -2, -3, -4 und -6 Breiten, wobei sich width-2-6 identisch verhält wie width-1-3. | Als Basis gibt es -1, -2, -3, -4 und -6 Breiten, wobei sich width-2-6 identisch verhält wie width-1-3. | ||
Um die Inhalte in einer Spalte anzuordnen, schreibt man sie an die Stelle der drei Punkte ( | Um die Inhalte in einer Spalte anzuordnen, schreibt man sie an die Stelle der drei Punkte (...) in den folgenden Beispielen. Dabei kann man auch Absätze, Listen, Tabellen etc. verwenden. | ||
<syntaxhighlight lang="html5"> | <syntaxhighlight lang="html5"> | ||
Zeile 78: | Zeile 61: | ||
</div> | </div> | ||
</syntaxhighlight> | </syntaxhighlight> | ||
<div class="grid"> | <div class="grid"> | ||
Zeile 92: | Zeile 76: | ||
</div> | </div> | ||
</syntaxhighlight> | </syntaxhighlight> | ||
<div class="grid"> | <div class="grid"> | ||
Zeile 105: | Zeile 90: | ||
</div> | </div> | ||
</syntaxhighlight> | </syntaxhighlight> | ||
<div class="grid"> | <div class="grid"> |
Aktuelle Version vom 6. April 2020, 20:52 Uhr
Vorlagen
Multimedia
- Einbinden von Medien (Youtube, Geogebra, etc.)
- Interaktive Übungen (z.B. Learning Apps, H5P, R-Quizze)
- Digitale Tools (zum kollaborativen Arbeiten) (z.B. Padlet, Mentimeter, AnswerGarden)
Tabellen
Der Einsatz von Tabellen im Grundschullernportal ist möglich und wird im ZUM-Wiki auf Hilfe:Tabellen ausführlich erklärt.
Mehrspaltenlayout
Es gibt Vorlagen für ein Mehrspalten-Layout auf großen Bildschirmen. Die Spalten ordnen sich bei schmalem Display, aber auch bei geringer Auflösung (z.B. am Beamer), untereinander an.
2 Spalten
Nähere Informationen und weitere Features findet man auf der Vorlagenseite unter: Vorlage:2Spalten
Das sieht man:
Die Hintergrundfarben dienen nur der Veranschaulichung.
Das schreibt man:
{{2Spalten| Spalte 1 | Spalte 2 }}
3 Spalten
Nähere Informationen und weitere Features findet man auf der Vorlagenseite unter: Vorlage:3Spalten
Das sieht man:
Die Hintergrundfarben dienen nur der Veranschaulichung.
Das schreibt man:
{{3Spalten| Spalte 1 | Spalte 2 | Spalte 3 }}
HTML-Markup
Als Basis gibt es -1, -2, -3, -4 und -6 Breiten, wobei sich width-2-6 identisch verhält wie width-1-3.
Um die Inhalte in einer Spalte anzuordnen, schreibt man sie an die Stelle der drei Punkte (...) in den folgenden Beispielen. Dabei kann man auch Absätze, Listen, Tabellen etc. verwenden.
<div class="grid">
<div class="width-1-3">...</div>
<div class="width-1-3">...</div>
<div class="width-1-3">...</div>
</div>
.width-1-3
.width-1-3
.width-1-3
<div class="grid">
<div class="width-1-2">...</div>
<div class="width-1-2">...</div>
</div>
.width-1-2
.width-1-2
<div class="grid">
<div class="width-1-4">...</div>
<div class="width-3-4">...</div>
</div>
.width-1-6
.width-5-6