i

Überschriften, Hervorhebungen, Boxen

Innerhalb des Textbereichs von Inhaltsseiten kann *normales* HTML geschrieben werden. Auf das Tag <p></p> kann dabei verzichtet werden, es wird automatisch ergänzt.

Achtung: Der Textbereich endet mit den abgrenzenden Strichen ---- und darunter folgt die Uuid die nicht verändert werden darf. Weitere Informationen auf der folgenden Seite.

Für den Textbereich stehen folgende Elemente per CSS-Klassen zur Verfügung:

Überschriften

Du kannst verschiedene Überschriften verwenden. Bitte beachte dabei die entsprechende Hierarchie. Wenn du eine <h4> (Überschrift der Größe 4) verwenden möchtest, so sollte dies innerhalb eines Abschnitts passieren, der von einer <h3> (Überschrift der Größe 3), passieren.

<h3>Überschrift 3</h3>
<h3 class="aufgabe">Überschrift 3 (Übungsaufgabe)</h3>
<h4>Überschrift 4</h4>

Renderergebnis

Seitenkopf (einmalig, wird automatisch aus title: generiert)

Überschrift 3

Überschrift 3 (Übungsaufgabe)

Überschrift 4

Wie du dem obigen Beispiel entnehmen kannst, erhalten Aufgabenüberschriften noch eine spezielle Klasse aufgabe, sodass sie von normalen Überschriften unterscheidbar sind.

Inline-Klassen

Innerhalb von Absätzen kannst du verschiedene Stile verwenden, die keine Blockelemente sind (und damit keinen Umbruch erzeugen sondern in der Zeile - inline - stehen)

Folgende Elemente stehen zur Verfügung

<em>Hervorgehoben</em>
<strong>Wichtig</strong>
<span class="konzept">Konzept</span>
<span class="proportional">Proportional</span>
Hervorgehoben
Wichtig
Konzept
Proportional

Hier ein Beispiel zur Verwendung dieser Inline-Classes

Eine Anweisung ist ein zentrales Konzept der Informatik. Unter dem Begriff der Anweisung versteht man etwas wie x=2.

Listen

Du kannst geordnete Listen

<ol>
    <li>Punkt</li>
    <li>Punkt</li>
    <li>Punkt</li>
</ol>
  1. Punkt
  2. Punkt
  3. Punkt

oder ungeordnete Listen verwenden:

<ul>
    <li>Punkt</li>
    <li>Punkt</li>
    <li>Punkt</li>
</ul>
  • PunktPunktPunktPunktPunktPunktPunktPunktPunkt PunktPunktPunktPunktPunkt PunktPunktPunktPunktPunktPunkt PunktPunktPunktPunkt PunktPunktPunktPunkt PunktPunktPunkt PunktPunktPunkt
  • Punkt
  • Punkt

Hinzu kommt noch eine ungeordnete Liste ohne Aufzählungspunkte

<ul class="ohne-listenpunkte">
    <li>Punkt</li>
    <li>Punkt</li>
    <li>Punkt</li>
</ul>
  • Punkt
  • Punkt
  • Punkt
Für geordnete Listenelemente gibt es zudem eine Klasse für die Nummerierung von Teilaufgaben mit einem Kreis als Hintergrund:
<ol class="aufgaben">
    <li>Punkt</li>
    <li>Punkt</li>
    <li>Punkt</li>
</ol>
  1. Punkt
  2. Punkt
  3. Lorem ipsum dolor sit amet consectetur adipisicing elit. Necessitatibus eveniet quaerat non laudantium placeat voluptas quasi quidem asperiores, dolorem veritatis, aspernatur rem tenetur architecto. Quis asperiores obcaecati numquam esse odio!
  4. Punkt

Bilder

Bilder können an verschiedenen Stellen positioniert werden. Zusätzlich bietet Javascript die Option eine Vergrößerung bei Klick.

Ein Bild rechts

<img alt="Testbild" class="rechts" src="testbild.jpg" width="200"/>
Testbild mit Vorschau rechts

Ein Bild in der Seitenmitte

Bilder können ebenfalls in der Seitenmitte positioniert werden. Auch dies ist mit der Option vorschau verwendbar.

<img alt="Testbild" class="mitte" src="testbild.jpg" width="200"/>
Testbild

Hinweis zu Bildern/Vergrößerungen

Bilder, die mit einer Quellenangabe versehen sind, erhalten automatische eine entsprechende figure-Box, in der sie sich dann befinden. Dadurch können die Bilder dann auch automatisch vergrößert dargestellt werden.

Audio/Video

Audio- und Videodateien können per passendem HTML-Tag eingefügt werden. Das Attribut poster="" ist dabei optional.
<video poster="vorschau.jpg" controls="controls" preload="none" src="AutoGrundgeruest.mp4" type="video/mp4">
Hinweis: Es dürfen keine Breiten- und Höhenangaben in Prozent gemacht werden, das führt zu Darstellungsproblemen.

Suche

v
15.6.3.3.1
www.inf-schule.de/infschule/dokumentation/kapitel-erstellen/textbereich/standard
www.inf-schule.de/15.6.3.3.1
www.inf-schule.de/@/page/us4dnzGAni16tat1

Rückmeldung geben