Aus Das deutschsprachige Scratch-Wiki

K
K
Zeile 1: Zeile 1:
 
{{zurHilfe}}
 
{{zurHilfe}}
In den vorherigen Kapiteln hast du gelernt, wie du mithilfe von verschiedensten Formatierungsmöglichkeiten deine Artikel optisch aufwerten kannst. Wichtig beim Erstellen von Artikeln ist aber nicht nur die Optik, sondern auch die Gliederung und Ordnung der einzelnen Elemente. Nachfolgend erhälst du einen Einblick in das '''Ordnen von Inhalten mithilfe von <nowiki><div></nowiki>'s und [[Scratch-Wiki:Hilfe:Tabellen|Tabellen]]'''.
+
In den vorherigen Kapiteln hast du gelernt, wie du mithilfe von verschiedensten Formatierungsmöglichkeiten deine Artikel optisch aufwerten kannst. Wichtig beim erstellen von Artikeln ist aber nicht nur die Optik, sondern auch die Gliederung und Ordnung der einzelnen Elemente. Nachfolgend erhälst du einen Einblick in das '''Ordnen von Inhalten mithilfe von <nowiki><div></nowiki>'s und [[Scratch-Wiki:Hilfe:Tabellen|Tabellen]]'''.
  
 
== Ordnen mit dem  <nowiki><div></nowiki> Element ==
 
== Ordnen mit dem  <nowiki><div></nowiki> Element ==

Version vom 9. April 2014, 14:13 Uhr

← zurück zum Hilfeportal


In den vorherigen Kapiteln hast du gelernt, wie du mithilfe von verschiedensten Formatierungsmöglichkeiten deine Artikel optisch aufwerten kannst. Wichtig beim erstellen von Artikeln ist aber nicht nur die Optik, sondern auch die Gliederung und Ordnung der einzelnen Elemente. Nachfolgend erhälst du einen Einblick in das Ordnen von Inhalten mithilfe von <div>'s und Tabellen.

Ordnen mit dem <div> Element

Das <div>-Element dient zum Gruppieren von Elementen in HTML und im Wiki-Syntax. Du kannst es benutzen, um Informationsblöcke zu erstellen oder um das Aussehen einer ganzen Gruppe von Elementen zu verändern.

Die Verwendung ist ziemlich simpel: Umschließe deine zu gruppierenden Elemente mit <div> und </div>. Allein dadurch wird die Gruppe vom Rest des Artikels abgetrennt.

Beispiel 1

<div> Im Alphabet sind alle Buchstaben (ohne Umlaute) unserer Sprache zu finden. [[Datei:A.png|Der Buchstabe A]] </div>

Das ergibt:

Im Alphabet sind alle Buchstaben (ohne Umlaute) unserer Sprache zu finden. Der Buchstabe A

Beispiel 2

Möchtest du nun noch einen Rahmen um die Gruppe ziehen, schreibst du:

<div style="border: 1px red solid">Inhalt</div>

Das ergibt:

Inhalt

Attribute

Wir haben dem div gerade in Beispiel 2 das Attribut style mit dem Wert border: 1px red solid zugeteilt. Zum Ordnen brauchen wir besonders das Attribut alingn. Es bedeutet etwa so viel wie Ausrichtung. Diesem Attribut können wir dann einen Wert zuteilen. Davon haben wir 3 Stück zur Auswahl:

  • right (rechts)
  • left (links)
  • center (mitte)

Ein Beispiel:

<div align="right">Text 1</div>
<div align="left">Text 2</div>
<div align="center">Text 3</div>

ergibt:

Text 1
Text 2
Text 3
Beispiel für Inhaltsverzeichnis

Ordnen mit Tabellen

Manchmal ist es jedoch besser, manche seiner Inhalte mit Tabellen zu ordnen, z.B. wenn man ein Inhaltsverzeichnis für seine Unterseiten erstellt (Beispiel siehe Bild). Um gleichmäßige Abstände zwischen Seitentiteln und der Beschreibung zu erhalten, wird eine Tabelle eingesetzt. Das Ergebnis sieht aus wie im Bild rechts.

Inhaltsverzeichnis code.PNG


Code zum Einbinden ins Forum:
[wiki=de:Scratch-Wiki:Hilfe:Ordnen mit div und Tabellen]Hilfe:Ordnen mit div und Tabellen[/wiki]

Kategorie:En-Link

Cookies helfen uns bei der Bereitstellung von Das deutschsprachige Scratch-Wiki. Durch die Nutzung von Das deutschsprachige Scratch-Wiki erklärst du dich damit einverstanden, dass wir Cookies speichern.