Comment implémenter différents types de liste en HTML?



Cet article vous fournira une connaissance détaillée et complète des différents types de List en HTML avec des exemples et du code.

Les listes sont l'un des moyens importants de représenter les données et les informations où chaque enregistrement est affiché sur une seule ligne. Il existe différentes manières de représenter des données dans une liste, par exemple de manière ordonnée ou de manière non ordonnée. Je couvrirai les sujets suivants de cette liste dans article:

Types de liste en HTML

Avant de commencer à créer une liste, examinons d'abord les balises HTML:





    • Utilisé pour définir une liste non ordonnée
      1. Utilisé pour définir une liste ordonnée
      2. Utilisé pour définir un élément de liste
      3. Utilisé pour définir une liste de description
      4. Utilisé pour définir un terme dans une liste de description
      5. Utilisé pour décrire le terme dans une liste de description

    Voyons comment vous pouvez créer différents types de liste en HTML.

    Liste non ordonnée

    Pour définir une liste non ordonnée en HTML, nous utilisons

      tag, puis nous définissons la liste des éléments dans
    • marque. Par défaut, la liste des éléments est marquée par des puces (c'est-à-dire de petits cercles noirs).



       

      Des sports

      • Criquet
      • Football
      • Base-ball

      Production:

      comment convertir double en int java

      Liste non ordonnée en HTML

      Liste HTML non ordonnée: différents marqueurs d'article



      Vous pouvez choisir parmi une liste de marqueurs à l'aide de la propriété de type de liste CSS. Examinons différentes propriétés de type de liste CSS que vous pouvez utiliser pour définir différents styles de marqueurs:

      • disque : Définit le marqueur d'élément de liste sur puce
      • cercle : Définit le marqueur d'élément de liste sur un cercle
      • carré : Définit le marqueur d'élément de liste sur un carré
      • aucun : Les éléments de la liste ne seront pas marqués

      Disque:

       

      Des sports

      • Criquet
      • Football
      • Base-ball

      Production:

      Disque en HTMLCercle:

       

      Des sports

      • Criquet
      • Football
      • Base-ball

      Production:

      Circle-List en HTMLCarré:

       

      Des sports

      • Criquet
      • Football
      • Base-ball

      Production:

      SquareAucun:

       

      Des sports

      • Criquet
      • Football
      • Base-ball

      Production:

      NoneMaintenant, après avoir compris comment créer une liste non ordonnée en HTML, voyons comment créer une liste ordonnée en HTML.

      Liste ordonnée

      Pour définir une liste ordonnée en HTML, nous utilisons

        tag, puis nous définissons la liste des éléments dans
      1. marque.
        Par défaut, la liste des éléments est marquée par des chiffres.

         

        Des sports

        1. Criquet
        2. Football
        3. Base-ball

        Production:

        Liste ordonnée en HTMLExaminons maintenant certaines des variantes de listes ordonnées.

        Liste HTML ordonnée - Attribut de type

        Il existe différents types de marqueurs d'élément pour une liste ordonnée:

        • type = '1' Les éléments de la liste seront numérotés (par défaut)

        • type = 'A' Les éléments de la liste seront numérotés avec des lettres majuscules

        • type = 'a' Les éléments de la liste seront numérotés avec des lettres minuscules

        • type = 'I' Les éléments de la liste seront numérotés avec des chiffres romains majuscules

        • type = 'i' Les éléments de la liste seront numérotés avec des chiffres romains minuscules

        Nombres:

         

        Des sports

        1. Criquet
        2. Football
        3. Base-ball

        Production:

        NumbersLettres capitales:

         

        Des sports

        1. Criquet
        2. Football
        3. Base-ball

        Production:

        Lettre majusculeMinuscules:

        qu'est-ce qu'une instance java
         

        Des sports

        1. Criquet
        2. Football
        3. Base-ball

        Production:

        Lettre minusculeNu romain majuscule mber s:

         

        Des sports

        1. Criquet
        2. Football
        3. Base-ball

        Production:

        Chiffre romain majuscule

        Chiffres romains minuscules:

         

        Des sports

        1. Criquet
        2. Football
        3. Base-ball

        Production:

        Chiffres romains minuscules

        Listes de description HTML

        Vous pouvez également créer des listes de descriptions en HTML. Une liste de description est utilisée pour créer une liste de termes et leur ajouter une description. Vous créez une liste de description en utilisant

        marque.
        tag définit le terme &
        La balise leur ajoute une description.

         

        Des sports

        Criquet
        Le cricket est un jeu de batte et de balle joué entre deux équipes de onze joueurs sur un terrain au centre duquel se trouve un terrain de 20 mètres avec un guichet à chaque extrémité, comprenant chacun deux bails équilibrés sur trois souches.
        Tennis de table
        Le tennis de table, également connu sous le nom de ping-pong, est un sport dans lequel deux ou quatre joueurs frappent une balle légère d'avant en arrière sur une table à l'aide de petites raquettes. Le jeu se déroule sur une table dure divisée par un filet.

        Production:

        Liste imbriquée en HTML

        Vous pouvez également créer une liste imbriquée en HTML.

         

        Des sports

        • Tennis de table
        • Criquet
          • Virat kohli
          • Joe Root
      2. Basketball

    Production:

    Maintenant, après avoir exécuté les extraits ci-dessus, vous auriez compris comment créer des listes en HTML. J'espère que ce blog est informatif et a une valeur ajoutée pour vous.

    Découvrez notre qui s'accompagne d'une formation en direct animée par un instructeur et d'une expérience de projet réelle. Cette formation vous permet de maîtriser les compétences nécessaires pour travailler avec les technologies Web back-end et front-end. Il comprend une formation sur le développement Web, jQuery, Angular, NodeJS, ExpressJS et MongoDB.

    Vous avez une question pour nous? Veuillez le mentionner dans la section commentaires du blog «Liste en HTML» et nous vous recontacterons.