Decker Anleitung

Technische Details - Bereiche

Sebastian Lukas Hauer

Lehrstuhl für Computergraphik, TU Dortmund

🚀 by Decker

Bereiche

Mithilfe von (mindestens) drei Doppelpunkten können Sie Bereiche Ihrer Folien umzäunen.

Der umzäunte Bereich wird in ein HTML-Blockelement namens div eingebettet. Diesen div-Bereich können Sie mithilfe von Klassen umgestalten.

Wenn Sie dem Bereich nur eine einzelne Klasse zuweisen wollen können Sie den Namen der Klasse direkt hinter die öffnenden Doppelpunkte notieren. Wenn Sie mehrere Einstellungen vornehmen möchten oder Doppelpunkte eindeutig als Bereich öffnende Doppelpunkte kennzeichnen wollen müssen Sie die Eigenschaften in geschweiften Klammern notieren.

::: fragment

:::

::: {.fragment}

:::
Diese beiden Notationen für einen Bereich mit nur einer einzelnen Klasse werden identisch übersetzt.

Öffnende und Schließende Doppelpunkte

Ein Bereich wird durch (mindestens) drei Doppelpunkte geöffnet, wenn kein anderer Bereich bisher geöffnet wurde.

Die Anzahl an Doppelpunkten hat keinerlei Einfluss auf ihre Bedeutung. Ein Bereich, der mit fünf Doppelpunkten geöffnet wird, kann von drei Doppelpunkten geschlossen werden.

Entsprechend müssen Sie den Anfang eines verschachtelten Bereiches eindeutig als solchen kennzeichnen. Dies können Sie durch Notieren einer leeren Attributangabe mit geschweiften Klammern erreichen.

Beispiel: Öffnende und Schließende Doppelpunkte

::: {}

Inhalt des äußeren Bereichs

:::: {}

Inhalt des inneren Bereichs

::::

:::
Nur durch die geschweiften Klammern sind die zweiten Doppelpunkte als Öffnende zu identifizieren. 
::::

Inhalt eines ersten Bereichs

:::

::::::

Inhalt eines zweiten Bereichs

::::
Die Anzahl der Doppelpunkte ist nicht relevant, um Anfang und Ende von Bereichen zu identifizieren

Resultate des oberen Beispiels

Inhalt des äußeren Bereichs

Inhalt des inneren Bereichs

Inhalt eines ersten Bereichs

Inhalt eines zweiten Bereichs

Den Bereichen wurde ein Rahmen zugewiesen um ihre Dimensionen zu kennzeichnen.

Bereiche mit besonderer Semantik

  • .quiz: Markiert den Inhalt eines Multiple-Choice-Quizzes
  • .quiz-mi: Markiert den Inhalt einer Zuordnungsaufgabe
  • .quiz-ft: Markiert den Inhalt einer Freitextaufgabe
  • .quiz-ic: Markiert den Inhalt einer Auswahlbox
  • .fragment: Markiert einen Bereich, dessen Inhalt erst nachträglich aufgedeckt werden soll
  • .details: Markiert einen Bereich, den man ausklappen kann (Beispiel folgt)
  • columns-x-y: Markiert einen Bereich, dessen Inhalte Spaltenweise anstatt Zeilenweise angeordnet werden sollen

Ausklappbare Bereiche

Möchten Sie einen Bereich auf den Folien haben, den man bei Bedarf ausklappen kann, können Sie die Klasse .details verwenden.

Ein .details-Bereich wird in ein HTML-Element mit dem selben Namen umgewandelt. Diese zeichnen sich durch eine Markierung aus, die darauf hinweist, dass mehr Informationen durch Anklicken des Elements abrufbar sind.

Ein .details-Bereich benötigt eine Zusammenfassung (engl. summary), die den “Klappentext” des Elements beschreibt.

Zusammenfassung

Inhalt des Bereichs.

Hier kann beliebig viel stehen.

Beispiel: Ausklappbare Bereiche

::: {.details summary="Zusammenfassung"}

Inhalt des Bereichs.

Hier kann beliebig viel stehen.

:::