Maison >interface Web >tutoriel HTML >Comment utiliser ul et li en HTML

Comment utiliser ul et li en HTML

下次还敢
下次还敢original
2024-04-27 21:00:271171parcourir

UL (liste non ordonnée) en HTML est utilisé pour créer une liste d'éléments, tandis que li (élément de liste) représente des éléments individuels dans la liste. Voici comment l'utiliser : Créez une liste non ordonnée :

  • Item
 Stylisez la liste : utilisez des listes imbriquées via des styles CSS, par exemple en modifiant le type de balisage, le remplissage et l'espacement. :
  • Projet
    • Sous-projet

Comment utiliser ul et li en HTML

HTML Medium ul Comment utiliser ul et li

Que sont ul et li ?

  • ul (liste non ordonnée) : Utilisé pour créer une liste d'éléments sans ordre spécifique entre les éléments.
  • li (élément de liste) : représente des éléments individuels dans une liste non ordonnée.

Comment utiliser ul et li ?

Créer une liste non ordonnée :

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

Ajouter des éléments de liste :

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

Définir le style de la liste

Vous pouvez définir l'apparence de la liste non ordonnée via des styles CSS, par exemple :

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

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

Utiliser des listes imbriquées

Vous pouvez utiliser des listes imbriquées pour créer des listes à plusieurs niveaux :

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

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn