Le code HTML pour les listes imbriquées

HTML offre un moyen flexible de créer des listes imbriquées grâce à ses éléments de liste non ordonnés et ordonnés. Celles-ci peuvent être imbriquées les unes dans les autres un nombre illimité de fois pour faciliter l'organisation des données hiérarchiques, telles que les en-têtes de chapitre et de sous-chapitre dans un document en ligne. À l'aide d'un code CSS, les listes imbriquées peuvent être stylées pour répondre à des besoins personnalisés, soit en attribuant des attributs globaux à la liste, soit en utilisant un style différent pour chaque couche du nid.

Types de liste

Vous pouvez utiliser deux types de listes en HTML et un élément d'élément de liste qui définit les éléments pour les deux. Le premier type de liste est une liste non ordonnée, appelée par le

    Mots clés. Cela donne une liste à puces - bien que vous puissiez supprimer les puces dans le CSS en définissant le type de style de liste sur "aucun". La seconde est une liste ordonnée, appelée avec
      , qui renvoie une liste numérotée. Entre les balises d'ouverture et de fermeture, vous définissez chaque élément de la liste. Par exemple:

      • Élément de liste 1
      • Élément de liste 2

      Liste imbriquée

      Pour créer une liste imbriquée, vous devez appeler un deuxième

        ou
          avant une donnée
        1. la balise a été fermée. Assurez-vous de fermer correctement la liste imbriquée. Par exemple, pour créer une liste ordonnée imbriquée dans une liste non ordonnée, utilisez le code suivant:

          • Élément de liste 1
            1. Élément de sous-liste 1
            2. Élément de sous-liste 2
            3. Élément de sous-liste 3
          • Élément de liste 2

          Assurez-vous de fermer chaque élément de la liste et chaque liste avec un code de fermeture, tel que

        2. ,
      et .

      Déclarer CSS

      Si vous souhaitez personnaliser l'apparence de la liste imbriquée, vous devez utiliser CSS, qui signifie "feuille de style en cascade". L'esthétique et le positionnement du CSS sont généralement contenus dans une feuille de style séparée, appelée entre les balises head avec un code similaire à celui-ci:

      CSS peut également être déclaré "Inline", ce qui signifie dans l'attribut HTML lui-même, comme ceci:

        Le CSS en ligne prime sur le code de la feuille de style.

        Dans la feuille de style

        Le code CSS doit être écrit dans un format spécifique pour fonctionner correctement. Dans la feuille de style, déclarez le code de chaque attribut dans le format suivant:

        ul {

        attribut: valeur;

        }

        Cela donnerait du style à la liste non ordonnée. Donner du style à un imbriqué

      • , utilisez le code suivant:

        li li {

        attribut: valeur;

        }

        Ceci définit le code de l'élément de liste sur deux couches de profondeur. Assurez-vous que toutes les lignes "attribut: valeur" se terminent par un point-virgule et assurez-vous que les accolades entourent l'élément que vous définissez.

      Recommandé