Com implementar diferents tipus de llista en HTML?



Aquest article us proporcionarà un coneixement detallat i exhaustiu de diferents tipus de llista en HTML amb exemples i codi.

Les llistes són una de les maneres importants de representar dades i informació en què es mostra cada registre en una sola línia. Hi ha diverses maneres de representar les dades en una llista, com ara de manera ordenada o de forma no ordenada. Tractaré els temes següents d’aquesta llista a article:

Tipus de llista en HTML

Abans de començar a crear una llista, examinem primer les etiquetes HTML:





    • S'utilitza per definir una llista no ordenada
      1. S'utilitza per definir una llista ordenada
      2. S'utilitza per definir un element de llista
      3. S’utilitza per definir una llista de descripcions
      4. S'utilitza per definir un terme en una llista de descripcions
      5. S'utilitza per descriure el terme en una llista de descripcions

    Comprenem com podeu crear diferents tipus de llista en HTML.

    Llista no ordenada

    Per definir una llista no ordenada en HTML que fem servir

      i definim la llista d'elements a
    • etiqueta. Per defecte, la llista d’elements es marca amb vinyetes (és a dir, petits cercles negres).



       

      Esports

      • Cricket
      • Futbol
      • Beisbol

      Sortida:

      Llista no ordenada en HTML

      Llista HTML sense ordenar: diferents marcadors d’elements



      Podeu triar entre una llista de marcadors mitjançant la propietat de tipus d'estil de llista CSS. Vegem diferents propietats tipus tipus d'estil de llista CSS que podeu utilitzar per definir diferents estils de marcadors:

      • disc : Estableix el marcador de l'element de la llista com a vinyeta
      • cercle : Estableix el marcador de l'element de la llista en un cercle
      • quadrat : Estableix el marcador de l'element de la llista en un quadrat
      • cap : Els elements de la llista no es marcaran

      Disc:

      titella contra xef contra estibador
       

      Esports

      • Cricket
      • Futbol
      • Beisbol

      Sortida:

      Disc en HTMLCercle:

       

      Esports

      • Cricket
      • Futbol
      • Beisbol

      Sortida:

      Llista de cercles en HTMLQuadrat:

       

      Esports

      • Cricket
      • Futbol
      • Beisbol

      Sortida:

      SquareCap:

       

      Esports

      • Cricket
      • Futbol
      • Beisbol

      Sortida:

      NoneAra, després d’entendre com es crea una llista no ordenada en HTML, comprenem com crear una llista ordenada en HTML.

      Llista ordenada

      Per definir una llista ordenada en HTML que fem servir

        i definim la llista d'elements a
      1. etiqueta.
        Per defecte, la llista d’elements es marca amb números.

         

        Esports

        1. Cricket
        2. Futbol
        3. Beisbol

        Sortida:

        Llista ordenada en HTMLVegem ara algunes de les variants de les llistes ordenades.

        Llista HTML ordenada: escriviu l'atribut

        Hi ha diferents tipus de marcadors d’elements per a una llista ordenada:

        • tipus = '1' Els elements de la llista es numeraran amb números (per defecte)

        • escriviu = 'A' Els elements de la llista es numeraran amb majúscules

        • escriviu = 'a' Els elements de la llista es numeraran amb minúscules

        • tipus = 'Jo' Els elements de la llista es numeraran amb números romans en majúscules

          tipus de funció en sql
        • tipus = 'i' Els elements de la llista es numeraran amb números romans en minúscula

        Números:

         

        Esports

        1. Cricket
        2. Futbol
        3. Beisbol

        Sortida:

        NumbersMajúscules:

         

        Esports

        1. Cricket
        2. Futbol
        3. Beisbol

        Sortida:

        Lletra majúsculaLletres minúscules:

         

        Esports

        1. Cricket
        2. Futbol
        3. Beisbol

        Sortida:

        Lletra minúsculaNu romà en majúscules mber s:

         

        Esports

        1. Cricket
        2. Futbol
        3. Beisbol

        Sortida:

        Número romà en majúscules

        Números romans en minúscula:

         

        Esports

        1. Cricket
        2. Futbol
        3. Beisbol

        Sortida:

        Números romans en minúscula

        Llistes de descripció HTML

        També podeu crear llistes de descripció en HTML. S'utilitza una llista de descripcions per crear una llista de termes i afegir-hi una descripció. Podeu crear una llista de descripcions amb

        etiqueta.
        etiqueta defineix el terme &
        etiqueta els afegeix descripció.

         

        Esports

        Cricket
        Cricket és un joc de pilota i bat que es juga entre dos equips d'onze jugadors en un camp al centre del qual hi ha un terreny de joc de 20 metres amb un wicket a cada extrem, que comprèn cadascun dos fiances equilibrats en tres troncs.
        Tennis taula
        El tennis de taula, també conegut com a ping-pong, és un esport en què dos o quatre jugadors colpegen una pilota lleugera cap endavant i cap enrere a través d’una taula amb petites raquetes. El joc té lloc sobre una taula dura dividida per una xarxa.

        Sortida:

        Llista imbricada en HTML

        També podeu crear una llista imbricada en HTML.

        el millor ide de Java per a Ubuntu
         

        Esports

        • Tennis taula
        • Cricket
          • Virat kohli
          • Joe Root
      2. Bàsquet

    Sortida:

    Ara, després d’executar els fragments anteriors, hauríeu entès com crear llistes en HTML. Espero que aquest bloc us sigui informatiu i de valor afegit.

    Consulteu el nostre que inclou formació en directe dirigida per un instructor i experiència en projectes reals. Aquesta formació us permet dominar les habilitats necessàries per treballar amb tecnologies web d’interfície i front-end. Inclou formació sobre desenvolupament web, jQuery, Angular, NodeJS, ExpressJS i MongoDB.

    Tens alguna pregunta? Si us plau, mencioneu-lo a la secció de comentaris del bloc 'Llista en HTML' i us respondrem.