Hur implementerar jag olika typer av listor i HTML?



Den här artikeln ger dig detaljerad och omfattande kunskap om olika typer av listor i HTML med exempel och kod.

Listor är ett av de viktiga sätten att representera data och information där varje post visas på en enda rad. Det finns olika sätt att representera data i en lista som på ett beställt sätt eller på ett oordnat sätt. Jag kommer att täcka följande ämnen i den här listan i artikel:

Typer av listor i HTML

Innan vi börjar skapa en lista, låt oss först titta på HTML-taggarna:





    • Används för att definiera en oordnad lista
      1. Används för att definiera en ordnad lista
      2. Används för att definiera ett listobjekt
      3. Används för att definiera en beskrivningslista
      4. Används för att definiera en term i en beskrivningslista
      5. Används för att beskriva termen i en beskrivningslista

    Låt oss förstå hur du kan skapa olika typer av en lista i HTML.

    Oordnad lista

    För att definiera en oordnad lista i HTML använder vi

      tagg och sedan definierar vi listan med objekt i
    • märka. Som standard är listan över objekt markerade med kulor (dvs. små svarta cirklar).



       

      sporter

      • Cricket
      • Fotboll
      • Baseboll

      Produktion:

      Oordnad lista i HTML

      Oordnad HTML-lista: Olika artikelmarkörer



      Du kan välja från en lista med markörer som använder CSS-list-typ-egenskap. Låt oss titta på olika egenskaper för CSS-listformat som du kan använda för att definiera olika markörstilar:

      • skiva : Ställer in listobjektmarkören till punkt
      • cirkel : Ställer in listobjektmarkören till en cirkel
      • fyrkant : Ställer in listobjektmarkören till en kvadrat
      • ingen : Listobjekten kommer inte att markeras

      Skiva:

       

      sporter

      • Cricket
      • Fotboll
      • Baseboll

      Produktion:

      Skiva i HTMLCirkel:

       

      sporter

      • Cricket
      • Fotboll
      • Baseboll

      Produktion:

      Cirkellista i HTMLFyrkant:

       

      sporter

      • Cricket
      • Fotboll
      • Baseboll

      Produktion:

      SquareIngen:

      skillnad mellan marionett och kock
       

      sporter

      • Cricket
      • Fotboll
      • Baseboll

      Produktion:

      NoneEfter att ha förstått hur man skapar en oordnad lista i HTML, ska vi förstå hur man skapar en ordnad lista i HTML.

      Beställd lista

      För att definiera en ordnad lista i HTML använder vi

        tagg och sedan definierar vi listan med objekt i
      1. märka.
        Som standard är listan med objekt markerade med siffror.

         

        sporter

        1. Cricket
        2. Fotboll
        3. Baseboll

        Produktion:

        Beställd lista i HTMLLåt oss nu titta på några av varianterna av ordnade listor.

        Beställd HTML-lista - Skriv attribut

        Det finns olika typer av artikelmarkörer för en beställd lista:

        • typ = ”1 ″ Listobjekten kommer att numreras med siffror (standard)

        • typ = ”A” Listobjekten kommer att numreras med stora bokstäver

          slå samman sorteringsbeslutsträd 4 element
        • typ = ”a” Listobjekten kommer att numreras med små bokstäver

        • typ = ”I” Listobjekten kommer att numreras med romerska versaler

        • typ = ”i” Listobjekten kommer att numreras med små bokstäver

        Tal:

         

        sporter

        1. Cricket
        2. Fotboll
        3. Baseboll

        Produktion:

        NumbersVersala bokstäver:

         

        sporter

        1. Cricket
        2. Fotboll
        3. Baseboll

        Produktion:

        VersalerGemener:

         

        sporter

        1. Cricket
        2. Fotboll
        3. Baseboll

        Produktion:

        Liten bokstavVersaler Roman Nu mber s:

         

        sporter

        1. Cricket
        2. Fotboll
        3. Baseboll

        Produktion:

        Versaler romerska nummer

        Romerska siffror med små bokstäver:

         

        sporter

        1. Cricket
        2. Fotboll
        3. Baseboll

        Produktion:

        Romerska siffror med små bokstäver

        HTML-beskrivningslistor

        Du kan också skapa beskrivningslistor i HTML. En beskrivningslista används för att skapa en lista med termer och lägga till en beskrivning till dem. Du skapar en beskrivningslista med

        märka.
        tag definierar termen &
        taggen lägger till beskrivning för dem.

         

        sporter

        Cricket
        Cricket är ett bat-and-ball-spel som spelas mellan två lag med elva spelare på ett fält i mitten av vilket är en 20-meters pitch med en wicket i vardera änden, var och en består av två bails balanserade på tre stubbar.
        Bordtennis
        Bordtennis, även känd som bordtennis, är en sport där två eller fyra spelare slår en lätt boll fram och tillbaka över ett bord med små racketar. Spelet äger rum på ett hårt bord dividerat med ett nät.

        Produktion:

        Kapslad lista i HTML

        Du kan också skapa en kapslad lista i HTML.

        skapa ett paket i java
         

        sporter

        • Bordtennis
        • Cricket
          • Virat kohli
          • Joe Root
      2. Basketboll

    Produktion:

    Efter att ha kört ovanstående utdrag skulle du ha förstått hur man skapar listor i HTML. Jag hoppas att den här bloggen är informativ och ger ett mervärde för dig.

    Kolla in vår som kommer med instruktörsledad liveutbildning och verklig projektupplevelse. Denna utbildning gör dig skicklig för att arbeta med back-end och front-end webbteknik. Det inkluderar utbildning om webbutveckling, jQuery, Angular, NodeJS, ExpressJS och MongoDB.

    Har du en fråga till oss? Vänligen nämna det i kommentarsektionen i 'Lista i HTML' -bloggen så kommer vi tillbaka till dig.