HTML Listor

HTML 支持有序、无序和定义列表

实例

无序列表
本例演示无序列表。
有序列表
本例演示有序列表。

（可以在本页底端找到更多实例。）

无序列表

无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。

无序列表始于 <ul> 标签。每个列表项始于 <li>。

<ul>
<li>Kaffe</li>
<li>Mjölk</li>
</ul>

Webbläsaren visar följande:

  • Kaffe
  • Mjölk

Inuti listobjekt kan man använda stycken, radbrytningar, bilder, länkar och andra listor m.m.

有序列表

Likaså är ordnade listor en rad poster, där listobjekten markeras med nummer.

Ordnade listor börjar med <ol>-taggen. Varje listobjekt börjar med <li>-taggen.

<ol>
<li>Kaffe</li>
<li>Mjölk</li>
</ol>

Webbläsaren visar följande:

  1. Kaffe
  2. Mjölk

Inuti listobjekt kan man använda stycken, radbrytningar, bilder, länkar och andra listor m.m.

Definierad lista

Anpassade listor är inte bara en rad poster, utan en kombination av poster och kommentarer.

Anpassade listor börjar med <dl>-taggen. Varje anpassad listpost börjar med <dt>. Varje anpassad listposts definition börjar med <dd>.

<dl>
<dt>Kaffe</dt>
<dd>Black hot drink</dd>
<dt>Mjölk</dt>
<dd>White cold drink</dd>
</dl>

Webbläsaren visar följande:

Kaffe
Svart varm dryck
Mjölk
Vit kall dryck

Inuti listobjektet för en definierad lista kan man använda stycken, radbrytningar, bilder, länkar och andra listor m.m.

Mer exempel

Olika typer av oordnade listor
Detta exempel visar en oordnad lista.
Olika typer av ordnade listor
Detta exempel visar olika typer av ordnade listor.
Nästlade lista
Detta exempel visar hur man nästlar listor.
Nästlade lista 2
Detta exempel visar mer komplexa nästlade listor.
Definierad lista
Detta exempel visar en definierad lista.

Listetaggar

Tagg Beskrivning
<ol> Definiera ordnad lista.
<ul> Definiera oordnad lista.
<li> Definiera listobjekt.
<dl> Definiera definierade listor.
<dt> Definiera definierade poster.
<dd> Definiera beskrivning av definierade.
<dir> Föråldrad. Använd <ul> istället.
<menu> Föråldrad. Använd <ul> istället.