HTML <ul> etiket

Definition og brug

<ul> tag til at definere en uordnet (med punkter) liste.

Brug <ul> tag og <li> tag til at oprette en uordnet liste.

Tip:Brug CSS tilIndstil liste style.

Tip:For numeriske lister, brug <ol> tag.

Se også:

HTML tutorial:HTML Liste

HTML DOM reference manual:Ul objekt

CSS tutorial:Indstil listens stil

Eksempel

Eksempel 1

En uordnet HTML liste:

<ul>
  <li>Kaffe
  <li>Té</li>
  <li>Mejeri
</ul>

Prøv det selv

Eksempel 2

Indstil forskellige liste styles (brug CSS):

<ul style="list-style-type:circle">
  <li>Kaffe
  <li>Té</li>
  <li>Mejeri
</ul>
<ul style="list-style-type:disc">
  <li>Kaffe
  <li>Té</li>
  <li>Mejeri
</ul>
<ul style="list-style-type:square">
  <li>Kaffe
  <li>Té</li>
  <li>Mejeri
</ul>

Prøv det selv

Eksempel 3

Udvid og缩小列表中的行高（brug CSS):

<ul style="line-height:180%">
  <li>Kaffe
  <li>Té</li>
  <li>Mejeri
</ul>
<ul style="line-height:80%">
  <li>Kaffe
  <li>Té</li>
  <li>Mejeri
</ul>

Prøv det selv

Eksempel 4

Opret en anden liste i listen (indlejret liste):

<ul>
  <li>Kaffe
  <li>Té
    <ul>
      <li>Pu'er
      <li>Grøn te</li>
    </ul>
  </li>
  <li>Mejeri
</ul>

Prøv det selv

Eksempel 5

Opret mere komplekse indlejrede lister:

<ul>
  <li>Kaffe
  <li>Té
    <ul>
      <li>Pu'er
      <li>Grøn te
        <ul>
          <li>Biluochun
          <li>Longjing
        </ul>
      </li>
    </ul>
  </li>
  <li>Mejeri
</ul>

Prøv det selv

Globale egenskaber

<ul> Etiketterne understøtter også Globale egenskaber i HTML.

eventegenskaber

<ul> Etiketterne understøtter også Eventegenskaber i HTML.

Standard CSS-indstillinger

De fleste browsere vil bruge følgende standardværdier til visning <ul> Element:

ul {
  display: block;
  list-style-type: disc;
  margin-top: 1em;
  margin-bottom: 1 em;
  margin-left: 0;
  margin-right: 0;
  padding-left: 40px;
}

Prøv det selv

Browser Support

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support Support Support Support Support