Unsere Datenschutzrichtlinie wird in Kürze aktualisiert. Bitte sehen Sie sich die Vorschau an.

Little Boxes – die HTML-Basics

Listen mit Aufzählungen und Nummerierungen als wichtiges Stilmittel

Testen Sie unsere 2015 Kurse

10 Tage kostenlos!

Jetzt testen Alle Abonnements anzeigen
Ungeordnete und geordnete Listen sind ein wichtiges Stilmittel zur Strukturierung von Text. Sie unterbrechen den Textfluss und bieten dem Auge des Betrachters beim Überfliegen der Webseite bildlich gesprochen Landeplätze an.

Transkript

Listen sind ein wichtiges Stilmittel zur Strukturierung von Text auf Webseiten und auch zur Auflockerung. Listen, also Aufzählungen und Nummerierungen werde ich Ihnen jetzt vorstellen. Und Listen bestehen aus zwei Elementen, das heißt, es ist also eine Liste, besteht aus zwei verschiedenen Elementen. Es geht los mit dem beginnenden, einleitenden tag ul für ungeordnete Liste, unordered list im Englischen. Und darin bekommt jedes Listenelement, jeder Listenpunkt, ein li Element. Also ul umschließt die gesamte Liste und jedes Listenelement bekommt ein li. "So funktioniert HTML". ist der erste Listenpunkt. Der zweite Listenpunkt li und /li wieder, "Wichtige HTML-Elemente". So, und der dritte Listenpunkt: "Gestalten mit CSS". So, das sind also ein ul- und drei li-Elemente, die von dem ul umschlossen werden. Auf der Webseite index.html, neu laden, sieht das so aus. Im Quelltext, deutlich zu sehen, ich zeige ihn gleich mal formatiert an, hier ist die ul-Liste, da sehen Sie das ul umschließt alles und die li-s liegen hier wunderbar schön drin. Woher kommt dieser Aufzählungspunkt? Antwort: aus dem Browser-Stylesheet. Wir haben hier nichts gesagt über Aufzählungspunkte, wir haben nur gesagt, das ist eine ungeordnete Liste mit drei Listenelementen. Die Einrückung hier im Browserfenster, das macht das Stylesheet, was hier im Firefox eingebaut ist und das könnte man später selbst überschreiben, andere Aufzähungspunke nehmen oder auch gar keine, das ist dann Arbeit mit CSS. Aber erst einmal kommt hier nur das HTML dran. Das ul sagt also, hier beginnt eine ungeordnete Liste, und dazwischen kommen die Listenelemente und ansonsten gibt es hier keine großartigen Geheimnisse. Ungeordnete Listen werden später auch als Grundlage für die Navigation verwendet und die sehen dann sehr, sehr unterschiedlich aus. Geordnete Listen, besser bekannt als Nummerierungen werden verwendet, wenn die Reihenfolge der Listetelemente wirklich wichtig ist. Dann steht also erstens, zweitens, drittens und dergleichen davor. Das ist dann ol, der Lieblingsbefehl aller Oldenburger, das ist das Autokennzeichen von Oldenburg, OL. Und dazwischen ändert sich gar nichts. Nur durch diese beiden Änderungen, dass das u zu einem o wird. Wenn im Anfangstag geändert wird, dann muss es hier auch geändert werden. Einmal speichern. Nur durch diese Änderung wird jetzt beim Neuladen hier erstens (1.), zweitens(2.), drittens (3.) angezeigt. So, und zurück in den Editor. Wenn Sie eine Aufzählung nicht mit 1 beginnen möchten, dann gibt es hier das Attribut start und da können Sie dann die Anfangszahl vorgeben. Also ich sage mal 3, start="3" Und dann wird hier begonnen mit 3, 4 und 5. Das ist im Editor dabei, Sie können auch den type der Aufzählung ändern. Also nicht mit normalen Zahlen, sondern wenn ich hier jetzt zum Beispiel mal sage "A" und 3, dann geht das mit C los, type="A" Ops, C-D-E. Und das kann man hier entsprechend anpassen. Der Normalfall wird aber sein, dass man nur ol benutzt. Gültige Werte hier für type ist nebenan großen, könnte man auch ein kleines a nehmen, ein kleines i oder ein großes I. Das sind alles Werte, die dabei gültig sind. Ich nehme das start-Attribut hier mal wieder raus. Wenn Sie jetzt das i hier einfach haben, dann sehen wir das im Browser so: erstens, zweitens, drittens (I, II, III). Und römisch eins (I) könnte man das auch nennen statt I. Und ol ohne tenk bei eins an mit einer arabischen Eins. Ich ändere das wieder zurück in eine ungeordnete Liste, so dass das hier so aussieht.

Little Boxes – die HTML-Basics

Sehen Sie, wie HTML und CSS funktionieren und lernen Sie die dabei die unabdingbaren Grundlagen der Webprogrammierung kennen.

3 Std. 3 min (41 Videos)
Derzeit sind keine Feedbacks vorhanden...
 
Software:
Exklusiv für Abo-Kunden
Ihr(e) Trainer:
Erscheinungsdatum:11.03.2015
Aktualisiert am:28.09.2016
Laufzeit:3 Std. 3 min (41 Videos)

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!