<ul>: Das Unordered List Element

Dieses Element enthält die globalen Attribute.

compact Veraltet

Dieses boolesche Attribut zeigt an, dass die Liste in einem kompakten Stil dargestellt werden sollte. Die Interpretation dieses Attributs hängt vom User Agent ab, und es funktioniert nicht in allen Browsern.

Warnung: Verwenden Sie dieses Attribut nicht, da es veraltet ist: Verwenden Sie stattdessen CSS. Um einen ähnlichen Effekt wie das compact-Attribut zu erzielen, kann die CSS-Eigenschaft line-height mit einem Wert von 80% verwendet werden.

type Veraltet

Dieses Attribut legt den Aufzählungsstil für die Liste fest. Die unter HTML3.2 und der Übergangsversion von HTML 4.0/4.01 definierten Werte sind:

• circle
• disc
• square

Ein vierter Aufzählungstyp wurde in der WebTV-Oberfläche definiert, aber nicht alle Browser unterstützen ihn: triangle.

Wenn nicht vorhanden und wenn keine CSS list-style-type-Eigenschaft auf das Element angewendet wird, wählt der User Agent einen Aufzählungstyp abhängig von der Verschachtelungsebene der Liste.

Warnung: Verwenden Sie dieses Attribut nicht, da es veraltet ist; verwenden Sie stattdessen die CSS list-style-type-Eigenschaft.

• Das <ul>-Element dient zum Gruppieren einer Sammlung von Elementen, die keine numerische Reihenfolge haben, und deren Reihenfolge in der Liste bedeutungslos ist. Typischerweise werden ungeordnete Listenelemente mit einem Aufzählungszeichen angezeigt, das verschiedene Formen annehmen kann, wie ein Punkt, ein Kreis oder ein Quadrat. Der Aufzählungsstil wird nicht in der HTML-Beschreibung der Seite definiert, sondern in ihrem zugehörigen CSS mithilfe der list-style-type-Eigenschaft.
• Die <ul>- und <ol>-Elemente können beliebig tief verschachtelt werden. Darüber hinaus dürfen die verschachtelten Listen ohne Einschränkung zwischen <ol> und <ul> wechseln.
• Die <ol>- und <ul>-Elemente stellen beide eine Liste von Elementen dar. Der Unterschied besteht darin, dass bei dem <ol>-Element die Reihenfolge bedeutungsvoll ist. Um zu bestimmen, welches verwendet werden soll, versuchen Sie, die Reihenfolge der Listenelemente zu ändern; wenn sich die Bedeutung ändert, sollte das <ol>-Element verwendet werden, andernfalls können Sie <ul> verwenden.

<ul>
  <li>first item</li>
  <li>second item</li>
  <li>third item</li>
</ul>

Ergebnis

<ul>
  <li>first item</li>
  <li>
    second item
    <!-- Look, the closing </li> tag is not placed here! -->
    <ul>
      <li>second item first subitem</li>
      <li>
        second item second subitem
        <!-- Same for the second nested unordered list! -->
        <ul>
          <li>second item second subitem first sub-subitem</li>
          <li>second item second subitem second sub-subitem</li>
          <li>second item second subitem third sub-subitem</li>
        </ul>
      </li>
      <!-- Closing </li> tag for the li that
                  contains the third unordered list -->
      <li>second item third subitem</li>
    </ul>
    <!-- Here is the closing </li> tag -->
  </li>
  <li>third item</li>
</ul>

Ergebnis

<ul>
  <li>first item</li>
  <li>
    second item
    <!-- Look, the closing </li> tag is not placed here! -->
    <ol>
      <li>second item first subitem</li>
      <li>second item second subitem</li>
      <li>second item third subitem</li>
    </ol>
    <!-- Here is the closing </li> tag -->
  </li>
  <li>third item</li>
</ul>

Ergebnis

• Andere listenbezogene HTML-Elemente: <ol>, <li>, <menu>

• CSS-Eigenschaften, die besonders nützlich sein können, um das <ul>-Element zu stylen:

  • die list-style-Eigenschaft, um die Darstellung des Ordnungszeichens zu wählen.
  • CSS-Zähler, um komplexe verschachtelte Listen zu handhaben.
  • die line-height-Eigenschaft, um das veraltete compact-Attribut zu simulieren.
  • die margin-Eigenschaft, um die Listeneinrückung zu steuern.