Heim  >  Artikel  >  Web-Frontend  >  So verwenden Sie ul und li in HTML

So verwenden Sie ul und li in HTML

下次还敢
下次还敢Original
2024-04-27 21:00:271101Durchsuche

UL (ungeordnete Liste) in HTML wird zum Erstellen einer Liste von Elementen verwendet, während li (Listenelement) einzelne Elemente in der Liste darstellt. So verwenden Sie es: Erstellen Sie eine ungeordnete Liste:

  • Item
Gestalten Sie die Liste: Verwenden Sie verschachtelte Listen über CSS-Stile, z. B. durch Ändern von Markup-Typ, Auffüllung und Abstand :
  • Projekt
    • Unterprojekt

So verwenden Sie ul und li in HTML

HTML Medium ul Verwendung ul und li

Was sind ul und li?

  • ul (ungeordnete Liste): Wird zum Erstellen einer Liste von Elementen ohne bestimmte Reihenfolge zwischen den Elementen verwendet.
  • li (Listenelement): repräsentiert einzelne Elemente in einer ungeordneten Liste.

Wie verwendet man ul und li?

Erstellen Sie eine ungeordnete Liste:

<code class="html"><ul>
  <!-- 无序列表中的项目 -->
</ul></code>

Listenelemente hinzufügen:

<code class="html"><ul>
  <li>项目 1</li>
  <li>项目 2</li>
  <li>项目 3</li>
</ul></code>

Legen Sie den Listenstil fest

Sie können das Erscheinungsbild der ungeordneten Liste über CSS-Stile festlegen, zum Beispiel:

<code class="css">ul {
  list-style-type: none;  /* 去除默认的圆点标记 */
  padding: 0;             /* 设置内边距为 0 */
}

li {
  display: inline-block;    /* 设置列表项为内联元素 */
  margin-right: 10px;     /* 设置列表项之间的间距 */
}</code>

Verschachtelte Listen verwenden

Sie können verschachtelte Listen verwenden, um mehrstufige Listen zu erstellen:

<code class="html"><ul>
  <li>项目 1
    <ul>
      <li>子项目 1</li>
      <li>子项目 2</li>
    </ul>
  </li>
  <li>项目 2</li>
</ul></code>

Das obige ist der detaillierte Inhalt vonSo verwenden Sie ul und li in HTML. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn