Lektion 16 - Verschiedene Listen

Admin
Administrator
Beiträge: 83
Registriert: Di 19. Aug 2014, 10:47

Lektion 16 - Verschiedene Listen

Beitrag von Admin » Di 19. Aug 2014, 11:18

Verschiedene Listen
[img]http://www.kreativ-workshops.net/kurse/images/smilies/icon_cool.gif[/img]Öffne zum Ausprobieren eine neue Seite, die du z.b. als glossar-text.html speicherst.
Um deinen Text zu gestalten, gibt es auch im Html verschiedene Listen.
  • Die Aufzählung
  • Nummerierung
  • Definitionslisten
Die Aufzählungen

[col]- unsortierte Listen <ul> - kennst du bereits. Du hast damit deine Navigation und die Galerie gebastelt. Aufzählungen sind aber auch für normalen Text gedacht. Wenn du mehrere Dinge aufzählen möchtest, ist es lesbarer in einer Liste anstatt in einem Fließtext.
Über die Formatsymbolleiste 1 findest du Symbole für die folgenden Listen:|#
Klicke auf das Bild für die Darstellung in Originalgröße
[/col]

[col]Listen ul
Bild
ul sollte eine einfache Auflistung sein. z.B.|
Beispiel unsortierte Liste
  • Guppies
  • Mollies
  • Schwertfische
Die unsortierte Liste stellt jedem Listenpunkt ein Symbol voran. Über den Stylesheet-Editor im Register: Listen wählst du das Symbol über das Menü Listentyp aus.[/col]
Möchtest du keinen der vorgegebenen Listentypen verwenden, sondern statt eines Symbols lieber eine eigene erstellte Grafik verwenden, stellst du den Listentyp auf "nicht angegeben" und wählst über Listentyp (Grafik) eine Grafik aus deinem image-Ordner.[popup]http://kompozer-8.kreativ-workshops.net/einst/screens/lektion16-2-1.png[/popup]
Nummerierungen
... oder auch[b] - ordentliche Listen - <ol>[/b], werden verwendet, wenn du eine Reihenfolge oder eine Gewichtung einzelner Punkte darstellen willst.[popup]http://kompozer-8.kreativ-workshops.net/einst/screens/lektion16-3-1.png[/popup]
[col]Listen <ol>
#
Klicke auf das Bild für die Darstellung in Originalgröße
|
Beispiel Nummerierte Liste
  1. Das neue Aquarium ohne chemische Mittel gründlich reinigen, um eventuelle Silikonreste und Staub zu entfernen.
  2. Den Boden gleichmäßig mit Granulat bedecken.
  3. Das Aquarium zur Hälfte mit Wasser füllen.
  4. Wasserpflanzen einsetzen.
  5. Das Aquarium mit Wasser auffüllen.
[/col]


[col]Die <ol> stellt jedem Listenpunkt eine Zahl voran. Über die Listeneigenschaften kannst du wählen, wie die Zahl aussehen soll:
einfach dezimal, mit führender Null, Römisch, Griechisch, Georgisch oder mit Buchstaben (Alpha).|#
Klicke auf das Bild für die Darstellung in Originalgröße
[/col]

Definitionen

[col]Eine Definitionsliste verwendest du um Begriffe zu erklären, also um Begriffe zu definieren. Du kannst sie über diese beiden Symbole einfügen:

Bild Bild

Die Definitionsliste besteht aus 3 Elmenten:
dl : Dieses Element umschließt die gesamte Liste
dt : der Begriff, der zu definieren ist
dd : die tatsächliche Definition des Begriffes. Mehrere dd können zu einer dt gehören.|
Beispiel DefinitionslisteGuppies
  • Auch Millionenfisch genannt ist sehr vermehrungsfreudig, betreibt jedoch keine Brutpflege. Die Jungen Guppies schlüpfen und sind sofort auf sich selber gestellt. Sie verstecken sich in den Aquarienpflanzen, um sich vor den Fischen im Aquarium zu schützen. Sie werden nicht nur von Raubfischen im Aquarium verspeist, sondern auch von der eigenen Spezies.
    Guppies sind Pflanzenfresser. Sie mögen eine dichte Bepflanzung wie z.B. Haarnixen.
[/col]


Inhaltsverzeichnis

[col]Zusätzlich zu diesen Listen ist es mit KompoZer möglich, ein Inhaltsverzeichnis zu erstellen. Hast du eine Seite mit z.B. Begriffserklärungen, kannst du hierzu automatisch ein Inhaltsverzeichnis erstellen.

Die Funktion findest du unter Menü Einfügen - Inhaltsverzeichnis - Einfügen.|#
Klicke auf das Bild für die Darstellung in Originalgröße
[/col]
Um ein Inhaltsverzeichnis erstellen lassen zu können, schreibst du erst deinen Text. Gestalte deinen Text mit Überschriften.[popup]http://kompozer-8.kreativ-workshops.net/einst/screens/lektion16-8.png[/popup]
[col]Ich habe in meinem Beispiel die Überschrift 3 verwendet.

Anschließend platzierst du den Cursor an die Stelle, wo du das Verzeichnis einfügen möchtest.

Klicke auf Menü Einfügen - Inhaltsverzeichnis - Einfügen und Stelle den Assistenten so ein, dass er nur deine Klasse bzw. deine Überschrift für das Verzeichnis verwendet.

Du kannst natürlich auch eine zweite Ebene einfügen damit könntest du z.B. als Ebene 1 alle Überschriften der Klasse 3 verwenden, die über eine bestimmte Klasse formatiert sind.|#
Klicke auf das Bild für die Darstellung in Originalgröße
[/col]

Klicke anschließend auf OK sodass KompoZer dir das Inhaltsverzeichnis erstellt. Die Begriffe im Inhaltsverzeichnis sind mit den entsprechenden Überschriften bzw. Klassen im Text über Anker verlinkt. Die Anker werden im Text als gelbes Kästchen dargestellt. Im Browser sind sie natürlich nicht zu sehen.[popup]http://kompozer-8.kreativ-workshops.net/einst/screens/lektion16-10.png[/popup]
Jetzt kannst du dein Inhaltsverzeichnis noch über dein Stylesheet verschönern und fertig.

Beispiel: Lösung

Übung

Erstelle eine kleine Infothek zu deinem Hobby. Z.B.
  • Die verschiedenen Sorten von Golfschlägern
  • Blumen und ihre Herkunft und Pflege
  • Baustoffe und was sie für Eigenschaften haben ...
Es gibt zu jedem Hobby viele Fachbegriffe, die ein Laie gerne auch in einer kleinen Übersicht nachschlagen möchte.

Wähle eine der Listenformen für deine Infothek aus.

Erstelle dazu ein Inhaltsverzeichnis. Wie oben beschrieben. Verwende eine Überschrift für das Verzeichnis. Formatiere anschließend das Verzeichnis über eine Klasse.

Lösung

Viel Spaß!

Benutzeravatar
kp2709
Beiträge: 52
Registriert: Mi 20. Aug 2014, 11:56
Wohnort: Bayern
Kontaktdaten:

Re: Lektion 16 - Verschiedene Listen

Beitrag von kp2709 » So 31. Aug 2014, 09:55

guten morgen
hier meine übung
http://reikuma27.reikuma.bplaced.de/web ... -text.html

schönen sonntag, bei uns weint der himmel ganz fest :cry:

lg
kurt
Das Leben ist ein Spiel, ich spiele für mein Leben gern!!!

camouflage1984
Beiträge: 244
Registriert: Di 19. Aug 2014, 14:34

Re: Lektion 16 - Verschiedene Listen

Beitrag von camouflage1984 » So 31. Aug 2014, 14:50

Hallo Kurt
kp2709 hat geschrieben:
bei uns weint der himmel ganz fest
Nicht nur bei dir :cry:

Sieht alles soweit gut aus, nur das hier

Code: Alles auswählen

<h4 class="infothek">
ist zu viel, die klasse meine ich. Bitte löschen.

Kannst aber schon weitermachen...

Dir auch einen schönen Sonntag

Gruß
Camouflage1984
Lachen ist gesund :-)
camouflage1984.de Webseite / wzp-galipix Das Galerie Script / wzp-cms Das einfache CMS / wzp-webdesign

Benutzeravatar
kp2709
Beiträge: 52
Registriert: Mi 20. Aug 2014, 11:56
Wohnort: Bayern
Kontaktdaten:

Re: Lektion 16 - Verschiedene Listen

Beitrag von kp2709 » So 31. Aug 2014, 16:12

hi,
erledigt habe ich gelöscht :) ,
geh jetzt zur nächsten über oder?


lg
kurt
Das Leben ist ein Spiel, ich spiele für mein Leben gern!!!

anke
Beiträge: 207
Registriert: Di 19. Aug 2014, 15:24
Kontaktdaten:

Re: Lektion 16 - Verschiedene Listen

Beitrag von anke » So 31. Aug 2014, 16:58

Jap, weiter gehts :)

Benutzeravatar
eibauoma
Beiträge: 45
Registriert: Mi 20. Aug 2014, 08:24

Re: Lektion 16 - Verschiedene Listen

Beitrag von eibauoma » So 21. Sep 2014, 22:40

http://gimpfreak.bplaced.net/gimpinfo2.html
Hier sind meine verschiedenen Listen zu sehen. Weil sich die Datei gimpinfo.html nicht speichern ließ, habe ich sie vorläufig unter gimpinfo2.html gespeichert.
Wäre es sinnvoll, die Glossarseite umzubenennen - auch in der Navigation?
[img]http://www.gimp-werkstatt.de/galerie/eibauoma/upload/Ausweise/unterschrift_eibauoma.png[/img][url=http://gimpfreak.bplaced.net/]meine Übungen mit dem Programm Kompozer[/url]

anke
Beiträge: 207
Registriert: Di 19. Aug 2014, 15:24
Kontaktdaten:

Re: Lektion 16 - Verschiedene Listen

Beitrag von anke » Mo 22. Sep 2014, 05:59

Hallo eibauoma

dein Glossar ist super geworden. Hast du herausgefunden, warum du die Seite nicht als gimp-info.html speichern konntest? Vom Namen her spricht da eigentlich nichts dagegen. Natürlich kannst du deine Navigation ändern, wenn du das möchtest. Denke nur daran, dass du die Navigation dann auf all deinen Seiten anpassen musst.

Viele Grüße

Ele ;)

Benutzeravatar
eibauoma
Beiträge: 45
Registriert: Mi 20. Aug 2014, 08:24

Re: Lektion 16 - Verschiedene Listen

Beitrag von eibauoma » Mo 22. Sep 2014, 07:36

Den Grund flür das "Nicht-speichern-können" habe ich nicht gefunden - es gab nur eine Fehleranzeige, dass die Datei nicht gespeichert werden kann. Unter geändertem Namen klappte es sofort.
[img]http://www.gimp-werkstatt.de/galerie/eibauoma/upload/Ausweise/unterschrift_eibauoma.png[/img][url=http://gimpfreak.bplaced.net/]meine Übungen mit dem Programm Kompozer[/url]

anke
Beiträge: 207
Registriert: Di 19. Aug 2014, 15:24
Kontaktdaten:

Re: Lektion 16 - Verschiedene Listen

Beitrag von anke » Mo 22. Sep 2014, 07:50

das ist jetzt mal was seltsam ... kann es sein, dass du statt .html ein ,html vergeben hast? Passiert mir auch hin und wieder, dass ich mich da auf der Tastatur vergreife.

Gruß Anke

Benutzeravatar
eibauoma
Beiträge: 45
Registriert: Mi 20. Aug 2014, 08:24

Re: Lektion 16 - Verschiedene Listen

Beitrag von eibauoma » Mo 22. Sep 2014, 08:03

Hallo Anke,
es wird schon irgendeine banale Ursache gegeben haben. Im Moment kann ich zwar die aktualisierte komplette Seite aufrufen (index-Datei) aber bei der gimpinfo-Seite kommt derzeit noch eine Fehleranzeige "
Diese Seite ist leider nicht mehr verfügbar oder noch nicht aktiv.Fehler 204 -
Werde es später noch mal probieren
[img]http://www.gimp-werkstatt.de/galerie/eibauoma/upload/Ausweise/unterschrift_eibauoma.png[/img][url=http://gimpfreak.bplaced.net/]meine Übungen mit dem Programm Kompozer[/url]

Antworten

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 1 Gast