Crearea listelor în html. Lista numerotata

Listele sunt o parte importantă a conținutului, deoarece ajută la organizarea informațiilor. Textul din liste este mai bine înțeles și mai ușor de reținut.

Cel mai simplu este că fiecare dintre elementele sale este precedat de un marker - un cerc, pătrat sau cerc. Ordinea articolelor dintr-o listă cu marcatori nu este importantă.

Pentru a-l crea, trebuie să utilizați doar două etichete:

și
• .
  este un container care conține o listă ale cărei elemente sunt specificate de etichetă
  • .
    • O piatra
    • Foarfece
    • Hârtie

    În mod implicit, un cerc negru ( disc). Prin adăugarea la etichetă

    atribut tipși atribuindu-i o valoare adecvată, marcatorul poate fi schimbat într-un cerc ( cerc) sau pătrat negru ( pătrat).

    Se deosebește de cel marcat prin faptul că ordinea elementelor din el este importantă și, prin urmare, în locul unui marcator, aici sunt folosite numere sau litere secvențiale. Nu trebuie să vă faceți griji pentru ordinea din listă: browserul preia această sarcină. Dacă modificați lista (eliminați sau adăugați un articol nefuncțional), browserul o va recalcula și o va afișa corect.

    Etichetele sunt folosite pentru a crea liste numerotate

    și
    1. ... Container
       definește începutul și sfârșitul listei, eticheta
       1. setează începutul și sfârșitul elementului său - totul este ca într-o listă cu marcatori, numai
          inlocuit de
          .
          1. O piatra
          2. Foarfece
          3. Hârtie

          

          Deoarece listele numerotate nu sunt întotdeauna atât de simple, pentru etichetă

          a creat următoarele atribute (notă: mai jos este o listă numerotată):

          1. tip... Acest atribut vă permite să numerotați lista nu numai cu arabă, ci și cu cifre romane sau litere latine de registru diferit. tip acceptă valorile 1 (implicit), a, A, i, I (încercați să experimentați singur cu ele).

          2. start... Numerotarea nu trebuie să înceapă întotdeauna cu una. Acest atribut vă permite să setați valoarea inițială - numărul primului element din listă. În acesta, puteți specifica că raportul începe, de exemplu, cu numărul 100 sau litera K.

          3. inversat... Dacă lista nu trebuie să treacă de la 1 la 10, ci de la 10 la 1, atunci acest atribut trebuie utilizat. Dacă este specificat, numerotarea se va efectua în ordine inversă.

          Pentru a seta un număr arbitrar unui element din mijlocul listei, trebuie să utilizați în etichetă

          1. atribut :

          2. Al patruzeci și cincilea element după treizeci și opta

          Schimbând numărul unui element din mijlocul listei, veți schimba și numerotarea tuturor elementelor următoare - raportul va începe de la valoarea din atributul value. De exemplu, dacă ați atribuit numărul 35 elementului 18, atunci următoarele elemente vor avea numerele nu 19, 20, 21, ci 36, 37, 38.

          Lista de definiții

          Tipul de listă nu este la fel de cunoscut ca cel discutat mai sus. Constă din termeni și definițiile acestora. Creat folosind etichete:

          - containerul care contine lista.

          - eticheta de termen.

          - etichetă de definiție

          Sfera de aplicare a listelor de definiții este glosare, cărți de referință, teste, dicționare și alte enumerații încăpătoare de tip „Termen - explicație”.

          Iată un exemplu de listă de definiții:

          Descriptor

          Unitatea de bază a limbajului de marcare cunoscută de toți sub numele de „Tag”.

          Atribut

          O proprietate de etichetă care îi oferă opțiuni suplimentare de stil de text.

          Eticheta

          O singură etichetă care nu trebuie să fie închisă.

          

          O listă formată din liste imbricate. Poate include liste de diferite tipuri. Complexitatea creării constă în observarea imbricației corecte a etichetelor, deoarece este ușor să fii confundat într-o structură pe mai multe niveluri.

          Iată un exemplu de listă pe mai multe niveluri:

          Limbajele de programare sunt împărțite în:

          • Structural
          1. Pascal
          2. Oberon
          1. Depozit de vechituri
          • Orientat obiect
          1. Java
          • Funcţional
          1. Lisp
          2. Piton

          Listele numerotate sunt o colecție de articole cu numerele lor secvențiale. Tipul și tipul numerotării depind de parametrii elementului

          , care este folosit pentru a crea lista. Următoarele valori pot fi folosite ca elemente de numerotare:
          • Cifre arabe (1, 2, 3, ...);
          • Cifre arabe cu zero înainte pentru cifrele mai mici de zece (01, 02, 03, ..., 10);
          • litere mari latine (A, B, C, ...);
          • litere latine mici (a, b, c, ...);
          • cifre romane majuscule (I, II, III, ...);
          • cifre romane mici (i, ii, iii, ...);
          • numerotarea armeană;
          • numerotarea georgiană.

          Ca aspect practic, principiile afișării articolelor din lista cu marcatori pot fi aplicate într-un mod similar unei liste numerotate. Dar având în vedere că avem de-a face cu o enumerare, există câteva caracteristici, care vor fi discutate mai jos.

          Numerotarea listei

          Este permisă începerea listei de la orice număr; atributul start al elementului este utilizat în acest scop

          sau valoarea elementului
          1. ... Orice număr întreg pozitiv poate fi specificat ca valoare. Nu contează ce tip de numerotare este setat, chiar dacă literele latine sunt folosite ca listă. Dacă atributele de început și valoare sunt aplicate listei în același timp, atunci aceasta din urmă are prioritate și numerotarea este afișată din numărul specificat de valoare, așa cum se arată în exemplul 1.

             Exemplul 1. Renumerotarea unei liste

             4. Ar trebui să aveți mare grijă de locul de muncă.
             5. Reglați iluminarea în cameră astfel încât sursa de lumină să fie în lateral sau în spatele operatorului.
             10. Pentru a evita complicațiile medicale, se recomandă alegerea unui scaun cu un scaun moale.

             Primul element al listei din acest exemplu va începe cu cifra romană IV, deoarece este specificat atributul start = „4”, apoi urmează numărul V, iar ultimul element urmează din ordine și i se atribuie numărul X (Fig. . 1).

             Orez. 1. Cifrele romane din listă

             Scrierea numerelor

             În mod implicit, o listă numerotată are o anumită formă: mai întâi există un număr, apoi un punct, iar apoi textul este afișat printr-un spațiu. Această formă de scriere este clară și convenabilă, dar unii dezvoltatori preferă să vadă un mod diferit de formatare a numerotării listelor. Și anume, în loc de punct, există o paranteză de închidere, așa cum se arată în Fig. 2 sau ceva asemanator.

             

             Orez. 2. Vedere a unei liste numerotate cu o paranteză

             Stilurile vă permit să schimbați modul în care listele sunt renumerotate utilizând proprietățile de conținut și de contraincrementare. În primul rând, trebuie să setați contra-resetarea: element pentru selectorul ol, acest lucru este necesar pentru ca numerotarea în fiecare listă nouă să înceapă de la capăt. În caz contrar, numerotarea va continua și în loc de 1,2,3 veți vedea 5,6,7. Valoarea articolului este un identificator unic pentru contor, o alegem noi înșine. În continuare, trebuie să ascundeți marcatorii inițiali prin proprietatea de stil list-style-type cu valoarea none.

             Proprietatea de conținut funcționează de obicei împreună cu pseudo-elementele :: după și :: înainte. Deci, li :: before construction spune că un anumit conținut trebuie adăugat înainte de fiecare element al listei (exemplul 2).

             Exemplul 2. Crearea propriei numerotari

             Li :: înainte (conținut: contor (articol) ")"; / * Adăugați o paranteză la numere * / counter-increment: item; / * Setați numele contorului * /)

             Proprietatea de conținut cu contorul de valoare (articolul) scoate un număr; adăugând o paranteză așa cum se arată în acest exemplu, obținem numerotarea necesară. contra-increment este necesar pentru a incrementa numărul listei cu unul. Rețineți că același identificator numit element este folosit pe tot parcursul. Codul final este prezentat în exemplul 3.

             Exemplul 3. Schimbarea vederii unei liste

             1. Primul
             2. Al doilea
             3. Al treilea
             4. Al patrulea

             În acest fel, puteți face orice fel de listă numerotată, de exemplu, luați un număr între paranteze drepte, în acest caz doar o singură linie se va schimba în stiluri.

             Conținut: „[” contor (articol) „]”;

             Lista cu litere rusești

             Există o listă numerotată cu litere latine, dar nu există litere rusești pentru listă. Ele pot fi adăugate artificial folosind tehnica de mai sus. Deoarece numerotarea se face prin stiluri, lista în sine rămâne originală, i se adaugă doar clasa selectată, să o numim chirilic (exemplul 4).

             Exemplul 4. Cod pentru crearea unei liste

             1. unu
             2. Două
             3. Trei

             Adăugarea de litere se face folosind pseudo-elementul :: before și proprietatea conținut. Deoarece fiecare rând trebuie să aibă propria sa literă, vom folosi pseudoclasa: nth-child (1), numărul literei este scris între paranteze. Prima literă, desigur, este A, a doua este B, a treia este C și așa mai departe. Acest întreg set este adăugat la selectorul li după cum urmează (exemplul 5).

             Exemplul 5. Folosind pseudoclasa: nth-child

             Chirilic li: nth-child (1) :: înainte (conținut: „a)”; ) .chirilic li: nth-child (2) :: înainte (conținut: „b)”; ) .chirilic li: nth-child (3) :: înainte (conținut: „în)”; )

             În acest exemplu, fiecare literă este urmată de o paranteză, toate litere mici. Puteți defini propriul mod de numerotare a listei, de exemplu, aceasta poate conține litere mari cu punct, cu una sau două paranteze sau numai litere. Spre deosebire de numerotarea standard, suntem liberi să facem tot ce vrem aici. O listă de zece litere ar trebui să fie suficientă pentru aproape toate situațiile, dar dacă acest lucru se dovedește brusc a nu fi suficient, nimic nu ne împiedică să ne extindem lista pentru a include cel puțin toate literele alfabetului rus.

             În final, stabilim alinierea și poziția literelor, dacă se dorește, indicăm dimensiunea fontului, culoarea și alți parametri (exemplul 6).

             Exemplul 6. Lista cu litere rusești

             1. Ciorbă
             2. cotlet de stiuca
             3. Kulebyaka
             4. Ciuperci în smântână
             5. Clatite cu caviar
             6. Cvas

             Rezultatul acestui exemplu este prezentat în Fig. 3.

             O listă este o colecție interconectată de fraze sau propoziții individuale care încep cu un marcator sau un număr. Listele oferă posibilitatea de a organiza și organiza diferite date și de a le prezenta într-un mod vizual și ușor de utilizat.

             Etichetă

             stabilește o listă numerotată, de ex. fiecare articol din listă începe cu un număr sau o literă și crește în ordine crescătoare.

             Stabilește o listă cu marcatori, fiecare element începe cu un caracter marcator mic.

             Etichetă

             1. definește un element individual de listă. Etichetă externă
                sau
                stabilește tipul listei - marcate sau numerotate.

                ,

                ,

                Cele trei elemente sunt pentru crearea unei liste de definiții. Fiecare astfel de listă începe cu un container

                unde merge eticheta

                crearea termenului și etichetei

                definind acest termen. Etichetă de final

                opțional, deoarece următoarea etichetă semnalează finalizarea elementului anterior. Cu toate acestea, este o practică bună să închideți toate etichetele.

                Listele numerotate sunt o colecție de articole cu numerele lor secvențiale. Tipul și tipul numerotării depind de atributele etichetei

                , care este folosit pentru a crea lista. Fiecare articol dintr-o listă numerotată este identificat printr-o etichetă
                1. așa cum se arată mai jos.
                   1. Primul punct
                   2. Al doilea punct
                   3. Al treilea punct

                   Dacă nu specificați niciun atribut suplimentar și scrieți doar eticheta

                   , atunci implicit este o listă cu numere arabe (1, 2, 3, ...), așa cum se arată în Exemplul 11.3.

                   Exemplul 11.3. Creați o listă numerotată

                   Lucrul cu timpul

                   1. crearea punctualității (nu vei întârzia niciodată la nimic);
                   2. recuperarea de la punctualitate (nu te grăbi nicăieri);
                   3. schimbând percepția asupra timpului și orelor.

                   Rezultatul acestui exemplu este prezentat în Fig. 11.3.

                   Orez. 11.3. Vizualizare listă numerotată

                   Rețineți că lista numerotată adaugă și indentări automate în partea de sus, de jos și din stânga textului.

                   Următoarele valori pot fi folosite ca elemente de numerotare:

                   • numere arabe (1, 2, 3, ...);
                   • litere mari latine (A, B, C, ...);
                   • litere latine mici (a, b, c, ...);
                   • numere romane majuscule (I, II, III, ...);
                   • numere romane mici (i, ii, iii, ...).

                   Atributul tip al etichetei este folosit pentru a indica tipul listei numerotate.

                   ... Valorile sale posibile sunt date în tabel. 11.2.
                   Tab. 11.2. Tipuri de liste numerotate

                   Tip de listă	cod HTML	Exemplu
                   numere arabe		1. Ceburașka 2. Crocodil Gena 3. Shapoklyak
                   Litere mari ale alfabetului latin		A. Cheburashka B. Crocodil Gena C. Shapoklyak
                   Litere mici ale alfabetului latin		A. Cheburashka b. Crocodilul Gena c. Shapoklyak
                   Numere romane majuscule		I. Cheburashka II. Crocodilul Gena III. Shapoklyak
                   Numere romane mici		i. Cheburashka ii. Crocodilul Gena iii. Shapoklyak

                   Pentru a începe lista la o anumită valoare, utilizați atributul start al etichetei

                   ... Nu contează ce tip de listă este setat folosind type, atributul start funcționează la fel cu numerele romane și arabe. Exemplul 11.4 arată cum să creați o listă folosind numere romane majuscule care încep cu opt.

                   Exemplul 11.4. Numerotarea listei

                   8. Regele Magnum XLIV
                   9. Regele Siegfried al XVI-lea
                   10. Regele Sigismund XXI
                   11. Regele Husbrandt I

                   Rezultatul acestui exemplu este prezentat în Fig. 11.4.

                   

                   Orez. 11.4. Lista numerotata cu numere romane