HTMLWiki.de: li
HTMLWiki.de >
HTML lernen • Beispiele • Tutorials • KI

[ START ] [ TUTORIAL ] [ HTML ] [ CSS ] [ KI ] [ SPIELWIESE ] [ SITEMAP ]

Das li-Element: Der Listenpunkt

Das <li> ("list item") ist der einzelne Eintrag einer Liste. Es lebt nie allein, sondern immer direkt in einer ul oder ol. Klingt nach wenig Stoff für eine eigene Seite, aber ein paar Dinge sollte man wissn.

Syntax

HTML-Code

<ul>
    <li>Ein schlichter Punkt</li>
    <li>
        <strong>Ein reichhaltiger Punkt</strong> mit einem
        <a href="/glossar/">Link</a> und mehr Text.
    </li>
</ul>

Was darf in ein li?

Erstaunlich viel. Anders als der Absatz verträgt ein li auch Block-Inhalte: mehrere Absätze, Bilder, Codeblöcke, sogar ganze Unterlisten (so entstehen verschachtelte Listen). Ein li ist also eher ein kleiner Container als eine Textzeile. Bei langen Einträgen mit mehreren Absätzen ruhig p-Elemente im li benutzen, das hält die Sache lesbar.

Das value-Attribut

Innerhalb einer ol kann ein li mit value="7" die laufende Nummer überschreiben, die folgenden Punkte zählen ab dort weiter. Braucht man selten, etwa bei unterbrochenen Zählungen, aber wenn man es braucht ist es Gold wert. In einer ul hat value keine Wirkung, dort gibt es ja nichts zu zählen.

Typische Fehler

  • li außerhalb einer Liste. Ein einsames li ohne ul oder ol drumherum ist ungültig.
  • Geschwister-Elemente neben li. Direkt in der Liste dürfen nur li-Elemente stehen, kein div dazwischen, kein loser Text.
  • Schließendes </li> weglassen. Ist technisch erlaubt (der Browser schließt selbst), macht verschachtelte Listen aber schnell unübersichtlich. Konsequent schließen erspart Rätselraten.

Verwandt: ul · ol · Block und Inline