Cascading Stylesheets – Zur Startseite Cascading Stylesheets Stil mit <Stil>

li ♦ <li> ... </li> ♦ IE4+ M1 N4+ O5+ ♦ HTML 2.0, 3.2, 4.0

Das <li>-Tag kennzeichnet ein Element in einer Aufzählung oder Liste. Das Tag ist sowohl in der geordneten Liste ol als auch in der ungeordneten Liste ul erforderlich. Es ist ebenfalls in zwei unerwünschten Tags erforderlich: dem <dir>- und dem <menu>-Tag.

Weder in geordneten noch in ungeordneten Aufzählungen gibt es im Grunde genommen irgendwelche Einschränkungen, denen der Text in der Aufzählung unterliegt – so können die Texte z.B. beliebig lang sein.

In einer ungeordneten Liste geht jedem Eintrag ein "Bullet", ein gefüllter Kreis, ein "*" oder ein ähnliches Symbol voran. In einer geordneten Liste geht jedem Eintrag eine Zahl, ein Buchstabe oder ein römisches Aufzählungszeichen voran, das mit jedem weiteren Listenelement heraufgezählt wird.

Das schließende Tag ist optional. Es wird allerdings empfohlen, das Tag zu setzen.

Kernattribute

class dir id lang onclick ondblclick onkeydown onkeypress onkeyup onmousedown onmousemove onmouseout onmouseover onmouseup style title
type unerwünscht 4.0 Das Attribut type bestimmt ein Zeichen, das der geordneten Liste vorangesetzt wird. In einer nummerierten Aufzählung sind die möglichen Werte 1 für arabische Ziffern, I oder i für große oder kleine lateinische Ziffern, A oder a für große oder kleine Buchstaben. In einer ungeordneten Aufzählung sind die möglichen Werte circle, disc und square.
value unerwünscht 4.0 Das Attribut value setzt den Ordnungswert, der einem Eintrag in einer geordneten Liste vorangeht. Das Attribut gilt seit HTML 4.0 als unerwünscht.

Beispiel

Dies ist eine ungeordnete Aufzählung:

<p>Es gibt drei Arten von Aufz&auml;hlungen: </p>
<ul>
  <li> Definitionslisten setzen sich 
       zusammen aus den drei Tags 
    <ul type="square">
      <li> dd-Tag </li>
      <li> dl-Tag </li>
      <li> dt-Tag </li>
    </ul>
  </li>
  <li> Nummerierte Aufz&auml;hlungen setzen 
       sich zusammen aus den beiden Tags 
    <ul type="circle">
      <li> Das &lt;ol&gt;-Tag &ouml;ffnet und 
           schlie&szlig;t die Aufz&auml;hlung </li>
      <li> Das &lt;li&gt;-Tag umschlie&szlig;t 
           jeden der einzelnen Eintr&auml;ge 
           der Aufz&auml;hlung </li>
    </ul>
  </li>
  <li> Ungeordnete Aufz&auml;hlungen setzen 
       sich zusammen aus den beiden Tags 
    <ul type="disc">
      <li> Das &lt;ol&gt;-Tag &ouml;ffnet 
           und schlie&szlig;t die Aufz&auml;hlung </li>
      <li> Das &lt;li &gt;-Tag umschlie&szlig;t 
           jeden der einzelnen Eintr&auml;ge 
           der Aufz&auml;hlung </li>
    </ul>
  </li>
</ul>

Darstellung

Es gibt drei Arten von Aufzählungen:

Beispiel

Dies ist eine geordnete Aufzählung:

<ol type="a">
  <li> Definitionslisten setzen sich zusammen 
       aus den drei Tags 
    <ol value="5">
      <li> dd-Tag </li>
      <li> dl-Tag </li>
      <li> dt-Tag </li>
    </ol>
  </li>
  <li> Nummerierte Aufz&auml;hlungen setzen sich 
       zusammen aus den beiden Tags 
    <ol type="I">
      <li> Das &lt;ol&gt;-Tag &ouml;ffnet und 
           schlie&szlig;t die Aufz&auml;hlung </li>
      <li> Das &lt;li&gt;-Tag umschlie&szlig;t jeden 
           der einzelnen Eintr&auml;ge der Aufz&auml;hlung </li>
    </ol>
  </li>
  <li>Ungeordnete Aufz&auml;hlungen setzen 
      sich zusammen aus den beiden Tags 
    <ol>
      <li> Das &lt;ol&gt;-Tag &ouml;ffnet und 
           schlie&szlig;t die Aufz&auml;hlung </li>
      <li> Das &lt;li&gt;-Tag umschlie&szlig;t jeden 
           der einzelnen Eintr&auml;ge der Aufz&auml;hlung</li>
     </ol>
  </li>
</ol>

Darstellung

  1. Definitionslisten setzen sich zusammen aus den drei Tags
    1. dd-Tag
    2. dl-Tag
    3. dt-Tag
  2. Nummerierte Aufzählungen setzen sich zusammen aus den beiden Tags
    1. Das <ol>-Tag öffnet und schließt die Aufzählung
    2. Das <li>-Tag umschließt jeden der einzelnen Einträge der Aufzählung
  3. Ungeordnete Aufzählungen setzen sich zusammen aus den beiden Tags
    1. Das <ol>-Tag öffnet und schließt die Aufzählung
    2. Das <li>-Tag umschließt jeden der einzelnen Einträge der Aufzählung

 

Cascading Styleheets – Stil mit <Stil> • Das Begleitmaterial zum Buch
© media engineering Ulrike Häßler 2002 • Frechen