Si mund të rregulloj artikujt e listave horizontalisht? Shembuj elegant të stilizimit të listave të CSS për çfarë përfaqësojnë etiketat ul ol li

Përshkrim

Atributet

përmbysur: Tregon që artikujt në listë do të shfaqen në rend zbritës (në vend që të ngjiten). Vlerat e mundshme të atributit boolean:

        Shënim: Atributi i përmbysur mbështetet vetëm nga Chrome dhe Safari.

        Start: Vendos vlerën fillestare të plotë nga e cila të filloni numërimin e artikujve në listë. Shembull »lloji: Përcakton llojin e shënuesit që do të përdoret për artikujt e listës:

        • 1 - numrat dhjetorë (1, 2, 3, 4 ...).
        • A - Shkronjat latine në rend alfabetik, me shkronjë të madhe (A, B, C, D ...).
        • a - Shkronjat latine në rend alfabetik, me shkronjë të vogël (a, b, c, d ...).
        • Une - numra të mëdhenj romakë (I, II, III, IV ...).
        • unë - Numrat romakë me shkronjë të vogël (i, ii, iii, iv ...).
        Shembull "

        Etiketoj

          gjithashtu mbështet Atributet dhe Ngjarjet Globale

          Stili i paracaktuar

          ol (shfaqja: bllok; lloji-style-type: dhjetor; margin-top: 1em; margin-fund: 1em; margin-majtas: 0; margin-right: 0; mbushje-majtas: 40px;)

          Shembull

          1. Kafe
          2. Çaj
          3. Qumësht
          1. Kafe
          2. Çaj
          3. Qumësht

          Dallimi i vetëm është se kjo etiketë është bërë në mënyrë rigoroze për listat e numërimit. Emri i etiketës vjen nga shkurtesa angleze "Lista e Renditur" - listë e numëruar.

          Sintaksa etiketë

            1. Pika # 1
            2. Pika # 2
            3. Pika # 3
            4. ...

            Aty ku tipari type \u003d "value" mund të marrë vlerat e mëposhtme

            • A - vendos shënjuesit në formën e shkronjave të mëdha latine (A, B, C ..);
            • a - vendos shënjuesit në formën e shkronjave të vogla latine (a, b, c ..);
            • I - vendos shënjues në formën e numrave të mëdhenj romakë (I, II, III, IV ..);
            • i - specifikon shënuesit në formën e numrave të vegjël romakë (i, ii, iii, iv ..);
            • 1 (parazgjedhur) - vendos shënuesit në formën e numrave arabë (1, 2, 3 ..);

            Atributi start \u003d "value" përcakton vlerën fillestare (vlerën fillestare) të raportit.

            Atributi i përmbysur specifikon një numërim të kundërt (nëse është e nevojshme).

            Etiketoj

              kërkon përdorimin e detyrueshëm të një etikete fundore

            Një etiketë palë përdoret për të formuar artikujt e listës

          1. ... Midis etiketave të hapjes dhe mbylljes janë fjalët individuale, frazat, paragrafët, imazhet, copat e kodit dhe shumë më tepër, të cilat janë përmbajtja e një liste me pika.

            shënim

            Brenda listës, mund ta ndryshoni llogarinë në llogarinë tuaj. Për këtë ekziston një vlerë e veçantë atributi \u003d "" për etiketën

          2. së cilës i është caktuar ndonjë vlerë numerike. për shembull

            1. Pika # 1
            2. Pika # 2
            3. Pika # 3

            Shembuj me lista të numëruara në html (
              )

            Shembull 1. Një listë e numëruar e html në formën e shkronjave latine

            Shembull me shkronja të mëdha

            1. Pika # 1
            2. Pika # 2
            3. Pika # 3
            1. Pika # 1
            2. Pika # 2
            3. Pika # 3

            Shembull me shkronja të vogla

            1. Pika # 10
            2. Pika # 11
            3. Pika # 12

            Kështu duket në faqe:

            1. Pika # 1
            2. Pika # 2
            3. Pika # 3

            Shembull 2. Lista e numëruar html me shkronja romake

            Shembull me shkronja të mëdha

            1. Pika # 1
            2. Pika # 2
            3. Pika # 3

            Kështu duket në faqe:

            1. Pika # 1
            2. Pika # 2
            3. Pika # 3

            Shembull me shkronja të vogla

            1. Pika # 1
            2. Pika # 2
            3. Pika # 3

            Kështu duket në faqe:

            1. Pika # 1
            2. Pika # 2
            3. Pika # 3

            Shembull 3. Html i numëruar rendit pozicionin e ndryshëm të fillimit

            Një shembull që tregon aftësitë e atributit start, i cili ju lejon të vendosni vlerën fillestare të counter.

            1. Pika # 1
            2. Pika # 2
            3. Pika # 3

            Kështu duket në faqe:

            1. Pika # 1
            2. Pika # 2
            3. Pika # 3

            Shembulli 4. Ndryshimi i llogarisë në listat e numëruara html

            Më poshtë është një shembull me aftësinë për të ndryshuar vlerat e numëruesit duke përdorur atributin e vlerës kur shfaqen elemente të rinj në etiketa

          3. .

            1. Pika # 1
            2. Pika # 2
            3. Pika # 3
            4. Pika # 4

            Kështu duket në faqe:

            1. Pika # 1
            2. Pika # 2
            3. Pika # 3
            4. Pika # 4

            Shembull 5. Lista e numëruar e kthyeshme në html

            Më poshtë është një shembull i një liste me numër të kundërt (duke numëruar në mënyrë të kundërt).

            1. Pika # 1
            2. Pika # 2
            3. Pika # 3
            4. Pika # 4

            Kështu duket në faqe:

            1. Pika # 1
            2. Pika # 2
            3. Pika # 3
            4. Pika # 4

            Listat mund të numërohen dhe të numërohen.

            Listat e numëruara nxirren me kod:

              Rendit me numra
            1. paragrafi 1
            2. pika 2
            3. pika 3

            Listat pa numër nxirren nga kodi:

              Renditni me shenja kontrolli ose simbole të tjera
            • paragrafi 1
            • paragrafi 1
            • paragrafi 1

            Çdo artikull në çdo listë është i mbyllur në një etiketë li. Të gjithë artikujt e listës janë mbështjellë me një etiketë të zakonshme ul ose ol. Stilet e këtyre etiketave janë të shkruara në fletën e stileve.

            Për secilën etiketë, caktohen stile specifike vizuale. Ato tregojnë indentet nga teksti.

            Për një listë të numëruar, stilet e numërimit janë të përshkruara për secilin artikull.

            Numrat standard arabë përshkruhen nga vlera dhjetore.

            lloji i stilit të listës: dhjetore; / * Shifrat arabe * /

            Për një listë me pika, ju specifikoni stilin e karakterit - katrorët ose qarqet.

            lloji i stilit të listës: rrethi; / * qarqet * /
            lloji i stilit të listës: katrori; / * sheshet * /

            Secilit artikull të menusë mund t'i caktohet një imazh.

            lista-style-image: url ('rruga për në imazh');

            Zakonisht, në shabllone, një listë e numëruar formatohet me numra të thjeshtë, dhe jo e numëruar - me katrorë dhe rrathë të zinj. Bshtë e mërzitshme dhe jo shprehëse. Le ta rregullojmë këtë.

            Ku janë stilet e listave në modelin Njëzet Njëmbëdhjetë?

            Hapni stilin e stilit.css. Gjeni seksionin e quajtur / * Elementet e tekstit * /

            Kodi standard duket kështu:

            Si mund të rregulloj një listë të numëruar?

            Lista e numëruar duke përdorur sfondin

            Shikoni këtë dizajn të bukur të listës me numër.

            Si? Le ta bejme sërisht.

            Gjeni stilet për etiketën ol. Shtoni prona të reja në të.

            Ol (mbushje: 0px 0 0 20px; diferencë: 0.5em 0 1.571em 1.9em; ngjyra: # 2E2E2E; lloji i stilit të listës: asnjë; font: 15px / 17px Verdana, Arial, Helvetica, sans-serif; z-index : 2; kundër-rivendosja: pika;) ol li (margjina-fund: 4px; lartësia e vijës: 1.6; ngjyra: # 2E2E2E; pozicioni: relativ;) ol li: para (diferenca-fund: 4px; kundër-rritja: pika 1; lartësia e vijës: 1.6; lartësia: 24px; margjina-majtas: -36px; majtas: 0px; gjerësia: 24px; margin-top: 1px; sfondi: # BDC3C7; përmbajtja: counter (pikë); rreshtimi i tekstit: qendra; pozicioni: absolut; pesha e shkronjave: e theksuar;)

            Në mënyrë që ju të kuptoni se ku duhet të ndryshoni për modelin tuaj, le ta heqim këtë kod nëpër rafte.

            lloji i stilit të listës: asnjë; - pamundëson daljen e shifrave standarde
            kundërvendosja: pika; - vendos një ndryshore për numëruesin e numërimit
            pozicioni: relativ; - vendet e numërimit pranë pikave vetë

            më parë është një pseudo-element për etiketën ol li. Ka stilet e mëposhtme:
            përmbajtja: counter (pikë); - shfaq vlerën e një ndryshoreje
            kundër-rritje: pika 1; - rrit numrin me 1
            pozicioni: absolut;
            sfond: # BDC3C7; - sfondi për numrat (sfondi mund të vendoset me ngjyra ose një ikonë të bukur
            marzhi - kufijtë
            mbushje - mbushje
            ngjyra - ngjyra e tekstit të elementit
            sfond - sfond
            përafrimi i tekstit - rreshtimi i tekstit
            font-weight - pesha (pesha) e shkronjave

            Në stilet tuaja, mund të vendosni çdo ngjyrë, rreshtim, madhësi të shkronjave dhe dhëmbëzime.

            Lista e numëruar me një imazh unik për secilin artikull

            Një faqe për gratë ka disa lista me numër mjaft tërheqës.

            Si zbatohet kjo? Le të hedhim një vështrim në kodin e mëposhtëm:

            / * numri i parë * / ol li: fëmija i parë (stili i stilit të listës: url (rruga për në figurë me numrin 1);) / * numri i dytë * / ol li: nth-child (2n) (stili i listës- imazhi: url (rruga për në figurë me numrin 2);) / * numri i tretë * / ol li: nth-child (3n) (lista-style-image: url (rruga për në figurë me numrin 3);) / * numri i katërt * / ol li: nth-child (4n) (lista-style-image: url (rruga për tek imazhi me numrin 4);) / * Tjetra, ne shkruajmë në të njëjtën mënyrë vetëm për numrat e artikullit vijues * /

            Në kodin e një liste të tillë të numëruar, duhet të rendisni të gjithë numrat e artikujve dhe të caktoni një ikonë unike për secilin prej tyre.

            Nëse në listat e artikujve përdorni deri në 20 artikuj të numëruar, atëherë duhet të regjistroni klasën pseudo të fëmijës së nëntë (Një) 20 herë. Kështu që e fundit në stile është pseudo-klasa e fëmijëve të nëntë (20n).

            Gjeni linjat në fletën e stileve që përshkruajnë pamjen e listës së numëruar (etiketat ol li).

            Shtoni asaj pseudo-klasën e fëmijës së parë. Kopjoni dhe ngjisni një herë, pastaj ndryshoni këtë veti në nth-child (An) dhe kopjoni sa më shumë numra që dëshironi të ketë ikona juaj. Shtoni numrat e artikujve.

            Për secilin numër, shtoni një pronë të figurës në stilin e listës me ikonën e vet unike.

            Nëse ikonat në sit ndodhen larg pikave ose i mbivendosin ato, atëherë duhet të ndryshoni shtrirjen dhe dhëmbëzimet e ikonave dixhitale ose tekstin e pikave.

            Si të rregulloni një listë me plumba (pa numër)?

            Lista e plumbosur ul li me ikona të alternuara

            Më pëlqeu shumë kjo listë me pika.

            Ul (mbushja: 11px 0 5px 0;) ul li (mbushja-majtas: 32px; margin-fund: 10px; font: normal 15px Verdana, sans-serif; ngjyra: # 2E2E2E; lartësia e vijës: 1.6; fundi i kufirit: 1px thyer #ccc; mbushje-fund: 10px;) ul li: para (përmbajtja: ""; pozicioni: absolut; gjerësia: 27px; lartësia: 24px; margjina-majtas: -35px; margin-top: -2px; sfondi: url ("images / sprite.jpg") 0px 2px pa përsëritje; lista-style-type: rreth;) ul li: nth-child (2n): përpara (përmbajtja: ""; pozicioni: absolut; gjerësia: 27px; lartësia: 43px; margjina-majtas: -35px; margin-top: -2px; sfondi: url ("images / sprite.jpg") 0px -17px pa përsëritje; lloji i stilit të listës: rrethi;)

            Në vend të stilit standard të stilit të listës, mund të caktoni vetinë "rruga për tek ikona" - lista-stili-imazhi: url. Por atëherë duhet të regjistroni kufirin e jashtëm të majtë nga skajet e faqes - pa të, ikonat nuk do të shfaqen, ato do të shkojnë përtej zonës së përmbajtjes.

            Për eksperimentin, mund të caktoni dhëmbëzime:

            Ul li (lista-style-image: url (images / radio.png); margjina-majtas: 30px;)

            Alternimi i ikonave mund të caktohet me vetinë e fëmijës së nëntë (Një). Shembulli i mësipërm përdor pseudo-elementin para.

            Kodi përmban një pseudo-klasë n-fëmijë (2n). Vlera e tij është 2. Rezulton se secili artikull çift ka një ikonë të ndryshme. Nëse në vend të 2n shkruani 2n + 1, atëherë ikona tjetër do të bjerë në pika tek.

            Ju mund të vendosni një nënvizim për secilin artikull në listë. Në shembullin e treguar, artikujt nënvizohen me një vijë me pika.

            Gjithashtu, secilit artikull mund t'i caktohen kornizat, sfondi, ikonat. Thjesht mos u tregoni shumë të zgjuar. Detyra jonë nuk është të mposhtim të gjithë me një model të zbukuruar, por të përmirësojmë cilësinë e perceptimit të përmbajtjes.

            Si të shfaqni lista të shumta me dizajn të ndryshëm në një faqe?

            Ndonjëherë ju duhet të vendosni disa lista me stile të ndryshme.

            Nëse caktoni stile të zakonshme, atëherë e njëjta pamje do të caktohet në të gjitha listat. Listat e ndryshme mund të shfaqen nëse i caktoni një ID të veçantë etiketës ol ose ul dhe e regjistroni atë në modalitetin e redaktimit të artikullit html. Epo, në fletën e stileve për këtë ID, duhet të regjistroni stile të ndara.

            Për shembull, këtu është një paraqitje e bukur për përmbajtjen:

            Në HTML, ju shkruani listën si kjo:

              Përmbajtja
            1. paragrafi 1
            2. pika 2
            3. pika 3

            Në CSS, ju do të shkruani stile si kjo:

            Ol # sod (mbushje: 0px 20px 10px 51px; diferencë: 0,5em 0 0em 1em; ngjyra: # 2E2E2E; lloji i stilit të listës: asnjë; sfond: # f1f4f5; kufiri majtas: # BDC3C7 4px i ngurtë; shfaqja: inline- bllok;) ol # sod li () ol # sod li: para (pesha e shkronjave: normale! e rëndësishme)

            Stili i ri ndryshon nga etiketa kryesore olimpike: sfondi, stili i shfaqjes, linja në të majtë të përmbajtjes.

            Duke përdorur disa lista me dizajn të ndryshëm në tekst, ju do ta bëni prezantimin e informacionit edhe më interesant. Kur renditni ndonjë send, mund të vendosni disa ikona, dhe kur rendisni veprime, të tjerë. Këtu, dizajni është i kufizuar vetëm nga imagjinata juaj.

            Këto metoda janë gjithashtu të zbatueshme në hartimin e artikujve të menusë, kategorive dhe çdo elementi tjetër të faqes.

            Si mund të krijoj lidhje ankorimi në një listë të përmbajtjes?

            Si t’i shkruani në kodin HTML? Një pjesë e kodit kornizon spirancën e lidhjes, dhe një pjesë tjetër e kodit vendoset pranë vendit ku duhet të biem kur të klikojmë në lidhje.

              Përmbajtja
            1. Titulli 1
            2. Titulli 2
            3. Titulli 3

            Dhe në tekstin e artikullit duhet të shkruani kështu:

            Kreu 1 ... Kreu 2 ... Kreu 3 ...

            Ndoshta webmasterat më me përvojë do të më korrigjojnë në diçka. Unë thjesht rekomandoj atë që kam provuar në praktikë vetë.

            Nëse keni ende ndonjë pyetje, unë do të jem i lumtur t'i shoh ato në komente.

            Ageeva Veronika.

            Ndoshta do të interesoheni gjithashtu për:

            Etiketat HTML

            Kuptimi dhe zbatimi

            Një listë e numëruar (e renditur) është për artikujt që ndjekin në një renditje specifike. Një listë e numëruar fillon me një etiketë

              (shkurt anglisht lista e porositur - lista e renditur). Çdo artikull i listës fillon me një etiketë
            1. (pika e listës).

              Mbështetja e shfletuesit

              Atribut
              Opera

              Eksplorues

              Edge
              fillo, shkruajpopopopopopo
              përmbysurpopopopoJoJo

              Atributet

              AtributVleraPërshkrim
              kompaktkompaktNuk mbështetet në HTML5.
              Tregon që lista duhet të jetë më e vogël se madhësia normale (lartësia e vijës: 80%).
              Përdorni CSS në vend të kësaj cilësie.
              përmbysurTregon që renditja në një listë të numëruar (renditur) duhet të jetë zbritëse. Atributi nuk mbështetet nga shfletuesit e Internet Explorer dhe Edge.
              fillojnumriPërcakton vlerën fillestare të një liste të renditur (të porositur). Vlerat duhet të jenë të plota, vlerat negative lejohen. Kur përdoret me shkronja (lloji \u003d "A" dhe lloji \u003d "a"), numri i specifikuar në vlerën e atributit është numri rendor i shkronjës në alfabet. Për shembull, start \u003d "4" do të përputhet me shkronjën "D" dhe lista do të fillojë me të. Kur përdorni vlerën start \u003d "27", njehsori rivendoset në zero dhe lista bëhet dyshifrore ("27" \u003d "AA", "28" \u003d "AB", "29" \u003d "AC" ...).
              lloji1 (parazgjedhur)
              Një pjesë të madhe)
              a (e vogël)
              Unë (i madh romak)
              unë (i vogël romak)
              Përcakton llojin e plumbit të përdorur në ndërtimin e një liste të numëruar (të porositur).

              Shembull i përdorimit

              Shembull i përdorimit të etiketës <ol> <span>
              1. Pika e parë Pika e dytë
              2. Pika e tretë
              3. Do të duket kështu në faqe:

                1. Pika e parë.
                2. Pika e dytë.
                3. Pika e tretë.

                Nëse dëshironi që lista të fillojë nga një numër specifik (jo nga 1), atëherë duhet të specifikoni atributin start për etiketën

                  .

                  Për shembull:

                    Një atribut tjetër interesant është lloji, i cili ju lejon të specifikoni numërimin alfabetik ("A" - i madh, "a" - i vogël), ose numërimi nga numrat romakë ("I" - në të madhe, "i" - në të vogël).

                    Merrni parasysh një shembull që tregon të gjitha vlerat e mundshme për tiparin tip (përveç standardit):

                    Një shembull i përdorimit të tiparit tip të një etiketimi HTML<оl>
                      >
                    1. Pika e parë Pika e dytë
                    2. Pika e tretë
                      1. >
                      2. Pika e parë Pika e dytë
                      3. Pika e tretë
                        1. >
                        2. Pika e parë Pika e dytë
                        3. Pika e tretë
                          1. >
                          2. Pika e parë Pika e dytë
                          3. Pika e tretë
                          4. Unë tërheq vëmendjen tuaj për faktin se lejohet të formohen lista të numëruara (të renditura) të vendosura në listat e tjera të numëruara (brenda një artikulli të listës

                          5. ):

                            Një shembull i një liste të numëruar të vendosur brenda një liste tjetër të numëruar <span>
                            1. Pika e parë
                              1. Pika e parë Pika e dytë
                              2. Pika e tretë
                              3. Pika e dytë
                              4. Pika e tretë
                              5. Do të duket kështu në faqe.

                                Listat HTML përdoren për të grupuar informacione të lidhura së bashku. Ekzistojnë tre lloje të listave:

                                listë me plumba

                                  - secili element i listës
                                • shënuar me një shënues,
                                  lista e numëruar
                                    - secili element i listës
                                  1. shënuar me një numër,
                                    lista e përkufizimeve - - përbëhet nga çifte termash
                                    përkufizimi.

                                    Çdo listë është një enë që përmban artikuj të listës ose çifte të përcaktimit të termave. Artikujt e listave sillen si elementë blloku, duke vendosur njëri nën tjetrin dhe duke marrë tërë gjerësinë e bllokut të kontejnerit. Çdo artikull i listës ka një kuti shtesë në krah, e cila nuk përfshihet në paraqitjen.

                                    Krijimi i Listave HTML

                                    1. Lista me plumba

                                    Lista me plumba është një listë e parenditur (nga Lista e Parregullt Angleze)... Krijuar duke përdorur një etiketë të çiftuar

                                    ... Shënuesi i një artikulli të listës është një etiketë, për shembull, një rreth i mbushur.

                                    Shfletuesit shtojnë formatimin e mëposhtëm në kutinë e listës si parazgjedhje:

                                    Çdo artikull i listës krijohet duke përdorur një etiketë çift

                                  2. (nga Artikulli i Listës Angleze).
                                    në dispozicion
                                  • Microsoft-i
                                  • Google
                                  • Mollë
                                  Figura: 1. Lista me plumba

                                  2. Lista e numëruar

                                  Lista e numëruar është krijuar duke përdorur një etiketë të çiftuar. Çdo artikull i listës krijohet gjithashtu duke përdorur elementin

                                • ... Shfletuesi numëron elementet sipas radhës automatikisht dhe nëse fshini një ose më shumë elementë të një liste të tillë, atëherë pjesa tjetër e numrave do të rillogaritet automatikisht.

                                  Kutia e listës gjithashtu ka stilet e parazgjedhura të shfletuesit:

                                • atributi i vlerës është i disponueshëm, i cili ju lejon të ndryshoni numrin e paracaktuar për artikullin e zgjedhur të listës. Për shembull, nëse për artikullin e parë në listën që keni vendosur
                                • , atëherë pjesa tjetër e numërimit do të rillogaritet në krahasim me vlerën e re.

                                  Për etiketë

                                    atributet e mëposhtme janë në dispozicion:

                                    Tabela 1. Atributet e etiketës
                                    Atribut Përshkrimi, vlera e pranuar
                                    përmbysur Atributi i përmbysur bën që lista të shfaqet në rend të kundërt (për shembull, 9, 8, 7 ...).
                                    filloj Atributi start përcakton vlerën fillestare nga e cila do të fillojë numërimi, për shembull, ndërtimi
                                      artikullit të parë do t'i caktohet një numër serial "10". Ju gjithashtu mund të specifikoni llojin e numërimit në të njëjtën kohë, për shembull,
                                        .
                                    lloji Atributi tip specifikon llojin e shënuesit që do të përdoret në listë (si shkronja ose numra). Vlerat e pranuara:
                                    1 - vlera e paracaktuar, numërimi dhjetor.
                                    A - numërimi i listës sipas rendit alfabetik, shkronjave të mëdha (A, B, C, D).
                                    a - numërimi i listës në rend alfabetik, shkronja të vogla (a, b, c, d).
                                    I - numërimi në numrat e kapitalit romak (I, II, III, IV).
                                    i - numërimi në shifra të vogla romake (i, ii, iii, iv).
                                    1. Microsoft-i
                                    2. Google
                                    3. Mollë
                                    Figura: 2. Lista e numëruar

                                    3. Lista e përkufizimeve

                                    Listat e përkufizimeve krijohen duke përdorur etiketën

                                    ... Etiketa përdoret për të shtuar një term
                                    , dhe për të futur një etiketë të përkufizimit
                                    .

                                    Kutia e listës së përkufizimit ka stilet e mëposhtme të parazgjedhura të shfletuesit:

                                    Për etiketat

                                    ,
                                    dhe
                                    në dispozicion.

                                    Prodhuesi:
                                    Petr Tochilin
                                    Cast:
                                    Andrey Gaidulyan
                                    Alexey Gavrilov
                                    Vitali Gogunsky
                                    Mariya Kozhevnikova

                                    Figura: 3. Lista e përkufizimeve

                                    4. Lista e vendosur

                                    Shpesh, aftësitë e listave të thjeshta nuk janë të mjaftueshme, për shembull, kur krijoni një tabelë të përmbajtjes, nuk mund të bëni pa të sende të folezuara... Shënimi për listën e mbivendosur do të jetë si më poshtë:

                                    • Paragrafi 1
                                    • Pika 2
                                      • Nënklasa 2.1.
                                      • Nënklasa 2.2.
                                        • Nënklasa 2.2.1.
                                        • Nënklasa 2.2.2.
                                      • Nënklasa 2.3.
                                    • Pika 3

                                    Figura: 4. Lista e vendosur

                                    5. Lista e numëruar në shumë nivele

                                    Një listë e shtresuar përdoret për të shfaqur artikujt e listës në nivele të ndryshme me prerje të ndryshme. Shënimi për një listë të numëruar me shumë nivele do të ishte si më poshtë:

                                    1. paragraf
                                    2. paragraf
                                      1. paragraf
                                      2. paragraf
                                      3. paragraf
                                        1. paragraf
                                        2. paragraf
                                        3. paragraf
                                      4. paragraf
                                    3. paragraf
                                    4. paragraf

                                    Kjo shenjë e paracaktuar do të krijojë një numërim të ri të bazuar në një për secilën listë të vendosur. Për të bërë numërimin e vendosur, duhet të përdorni vetitë e mëposhtme:
                                    kundër-rivendosja rivendos një ose më shumë sportele, duke vendosur një vlerë për të rivendosur;
                                    kundër-rritja specifikon vlerën e rritjes së kundër, d.m.th. me cilin hap do të numërohet secili artikull pasues;
                                    përmbajtja - përmbajtja e gjeneruar, në këtë rast është përgjegjëse për shfaqjen e numrit para secilit artikull në listë.

                                    Ol (/ * hiqni numërimin standard * / stili i listës: asnjë; / * Identifikoni numëruesin dhe vendoseni emrin li. Vlera e kundërt nuk është specifikuar - si parazgjedhje është 0 * / kundër-rivendosja: li;) li: para (/ * Ne përcaktojmë elementin që do të numërohet - li. Pseudo-elementi paraprak specifikon që përmbajtja e futur duke përdorur vetinë e përmbajtjes do të vendoset para artikujve të listës. Gjithashtu vendos vlerën e rritjes së kundërvënësit (parazgjedhja është 1). * / Counter-increment: li; / * Prona e përmbajtjes tregon numrin e sporteleve të artikullit të listës () do të thotë që teksti i gjeneruar është vlera e të gjithë sporteleve me atë emër. Një periudhë e cituar shton një periudhë ndarëse midis numrave dhe një periudhë me një hapësirë \u200b\u200bshtohet para përmbajtjes së secilit artikull të listës * / përmbajtja: sportele (li, ".") ".";)
                                    Figura: 5. Lista e numëruar në shumë nivele