Singura diferență este că această etichetă este făcută strict pentru listele de numerotare. Numele etichetei provine de la abrevierea engleză „Ordered List” – listă numerotată.
Sintaxa etichetei
- Elementul #1
- Elementul #2
- Elementul #3
- ...
Unde atributul tip = „valoare” poate lua următoarele valori
- A - stabilește marcatori sub formă de litere mari latine (A, B, C ..);
- a - stabilește marcatori sub formă de litere latine mici (a, b, c ..);
- I - setează marcaje sub formă de cifre romane mari (I, II, III, IV ..);
- i - precizează marcajele sub formă de cifre romane mici (i, ii, iii, iv ..);
- 1 (implicit) - specifică marcajele sub formă de cifre arabe (1, 2, 3 ..);
Atributul start = „valoare” stabilește valoarea inițială (valoarea de început) a raportului.
Atributul inversat specifică o numărătoare inversă (dacă este necesar).
Etichetă
- necesită utilizarea obligatorie a unei etichete finale
O etichetă asociată este utilizată pentru a forma elementele din listă
Notă
În interiorul listei, puteți schimba contul în al dvs. Pentru aceasta, există o valoare de atribut specială = "" pentru etichetă
- Elementul #1
- Elementul #2
- Elementul #3
Exemple cu liste numerotate în html ( )
Exemplul 1. Listă html numerotată sub formă de litere latine
Exemplu cu litere mari
- Elementul #1
- Elementul #2
- Elementul #3
- Elementul #1
- Elementul #2
- Elementul #3
Exemplu cu litere mici
- Elementul #10
- Elementul # 11
- Elementul #12
Așa arată pe pagină:
- Elementul #1
- Elementul #2
- Elementul #3
Exemplul 2. Lista html numerotata cu litere romane
Exemplu cu litere mari
- Elementul #1
- Elementul #2
- Elementul #3
Așa arată pe pagină:
- Elementul #1
- Elementul #2
- Elementul #3
Exemplu cu litere mici
- Elementul #1
- Elementul #2
- Elementul #3
Așa arată pe pagină:
- Elementul #1
- Elementul #2
- Elementul #3
Exemplul 3. html numerotat listează diferite poziții de start
Un exemplu care arată capabilitățile atributului start, care vă permite să setați valoarea de pornire a contorului.
- Elementul #1
- Elementul #2
- Elementul #3
Așa arată pe pagină:
- Elementul #1
- Elementul #2
- Elementul #3
Exemplul 4. Schimbarea contului în liste html numerotate
Mai jos este un exemplu cu capacitatea de a schimba valorile contorului folosind atributul value atunci când se afișează elemente noi în etichete
- Elementul #1
- Elementul #2
- Elementul #3
- Elementul #4
Așa arată pe pagină:
- Elementul #1
- Elementul #2
- Elementul #3
- Elementul #4
Exemplul 5. Lista numerotată reversibilă în html
Mai jos este un exemplu de listă numerotată inversă (numărând în ordine inversă).
- Elementul #1
- Elementul #2
- Elementul #3
- Elementul #4
Așa arată pe pagină:
- Elementul #1
- Elementul #2
- Elementul #3
- Elementul #4
În limbajul de marcare html, există 3 tipuri de liste - liste ordonate (numerotate), neordonate (nenumerotate) și liste de definiții.
Pentru a construi o astfel de listă, aveți nevoie de 2 tipuri de elemente: „ul” (prescurtare pentru listă neordonată, adică o listă neordonată) și „li” (articol de listă). Orice lucru scris în interiorul „li” este marcat cu un marker.
Aspectul unei astfel de liste poate fi controlat prin specificarea tipurilor de marcatori.
Tipuri de markere
Există un atribut de tip special, care este plasat pe ambele elemente ale listei. Acesta este tipul dvs. de marker. Există în total 3 tipuri: cerc, disc și pătrat:
- - pătrat
- primul element
- al doilea element
- ultimul element
- Departamentul de marketing
- Acest departament este angajat în promovarea bunurilor și serviciilor
- Departament financiar
- Acest departament se ocupă de toate tranzacțiile financiare
- VESTIREA ZILEI
-
- Astăzi ploaia
- Va ploua toată ziua
- ȘTIREA NOPȚII
- Va ploua noaptea
- Mâine va începe o nouă zi
- Prima linie
- Al doilea
- Ultimul element
- - cerc umplut (implicit);
- - cerc deschis;
- - pătrat
- Un marker sub forma unui disc umplut
- Marker sub forma unui disc nevopsit
- Pătrat
- Prima linie
- Al doilea punct
- A treia linie
- - numerotarea se va efectua cu cifre arabe obișnuite (se va folosi implicit aceeași opțiune, în lipsa atributului „Tip”);
- - majuscule ca numerotare;
- - litere mici;
- - cifre romane majuscule;
- - cifre romane minuscule;
- cu numerotare cu cifre romane mari
- Numerotarea cu litere mici latine
- Cifre romane mici
- Primul element al cărui număr este specificat în eticheta OL prin atributul start = „23”.
- Următorul articol, cu un număr unu mai mare
- Inca unul inca
- Primul articol cu numărul unu
- Acest element va primi numărul specificat în atributul value = "32".
- Articol cu un număr mare
- Primul punct
- Al doilea
- Ultimul
- Primul termen
- Descriere
- Al doilea mandat
- Descrierea lui
- Primul paragraf al principalului numerotat
- Al doilea punct
- Primul element al marcatoarelor imbricate
- Al doilea
- Al treilea și ultimul paragraf etichetat
- Al treilea articol numerotat
- (LI - Item List). Etichetă
- nu are nevoie de o etichetă de capăt adecvată, deși prezența acesteia nu este în principiu interzisă. Browserele încep de obicei fiecare articol nou din listă pe o linie nouă atunci când afișează un document.
Informațiile furnizate sunt suficiente pentru a construi o listă elementară cu marcatori. Iată un exemplu de document HTML care utilizează o listă cu marcatori, care este afișată într-un browser, așa cum se arată în Fig. 2.1.
Exemplu de listă cu marcatori Semne zodiacale:
- Berbec
- Taurul
- Gemenii
- Fecioara
- cântare
- Scorpion
- Săgetător
- Capricornul
- Vărsător
- Pești
Orez. 2.1. Browser Afișează lista cu marcatori
Rețineți că, în plus față de elementele din listă marcate cu eticheta
- , alte elemente HTML pot fi prezente. În exemplul de mai sus, unul dintre aceste elemente este textul simplu, care nu este un element de listă, dar joacă rolul titlului său.
Notă
Unele manuale HTML vă indică să utilizați eticheta container pentru a seta titlul listei.
(LH - Antet listă, antet listă). În prezent, această etichetă nu este recunoscută de niciunul dintre browserele principale și nu face parte din specificația HTML. Astfel, aplicarea sa devine lipsită de sens, deși nu va duce la erori. În etichetă
- pot fi specificați doi parametri: COMPACT și TYPE.
- .
Exemplu de înregistrare:
- .
Notă
Browserele au interpretări diferite pentru a specifica un tip de marcator pentru un articol individual din listă. Browserul Netscape modifică tipul de marcare pentru acesta și pentru toate cele ulterioare până când întâlnește o altă modificare a tipului de marcator. Internet Explorer modifică marcatorul numai pentru acest element.
Marcatori grafici de listă
Elementele grafice pot fi folosite ca marcatori de listă, care sunt utilizate pe scară largă pentru a crea documente HTML atractive, frumos proiectate. De fapt, o astfel de posibilitate nu este oferită direct de limbajul HTML, ci este implementată oarecum artificial. Acest lucru nu înseamnă că nu este recomandat sau condamnabil să faceți acest lucru, ci înseamnă doar că nu vor fi folosite constructe speciale de limbaj HTML aici.
Pentru a înțelege ideea, trebuie să înțelegeți cum sunt implementate listele în paginile HTML. Se pare că eticheta listă
- (precum și etichetele altor tipuri de liste, considerate mai jos) îndeplinește singura sarcină - îi spune browserului că toate informațiile aflate după această etichetă ar trebui să fie afișate cu o deplasare la dreapta (indentată) cu o anumită sumă. Etichete
- care indică elementele individuale ale listei oferă marcatori standard pentru elementele listei.
Dacă trebuie să construim o listă cu marcatori grafici, atunci ne putem descurca complet fără etichete.
- ... Va fi suficient să inserați imaginea grafică dorită în fața fiecărui element din listă. Singura problemă care trebuie rezolvată în acest caz va fi separarea elementelor listei unele de altele. Puteți utiliza etichete de paragraf pentru aceasta
Sau avans forțat în linie
... Un exemplu de implementare a unei liste cu marcatori grafici, a cărei afișare este prezentată în Fig. 2.2 este prezentat mai jos:care va fi transmisă o singură dată. Dimensiunea unui fișier care conține o imagine mică este, de asemenea, extrem de mică.
Notă
Metodele de creare a listelor cu marcatori grafici sunt discutate pe rând în capitolul 8.
Listele sunt adesea folosite pe paginile web, așa că această întrebare este foarte relevantă. HTML oferă două tipuri de liste: numerotate și nenumerotate (marcate). Etichetele speciale sunt folosite pentru a construi liste. Ne vom familiariza cu etichetele principale în această lecție. Să ne uităm la tipurile de liste în HTML în ordine și, folosind exemple reale, ne vom da seama cum diferă și cum sunt afișate.
Liste numerotate în HTML
Listele numerotate în HTML sunt o secvență ordonată de elemente. Într-o listă numerotată, fiecare element este precedat automat de un număr secvenţial. O listă numerotată arată astfel:
- Primul articol din listă
- Al doilea articol din listă
- Al treilea articol din listă
- Al patrulea articol din listă
- Al cincilea articol din listă
În acest exemplu, lista va fi afișată cu cifre arabe. Listele numerotate au atribute care pot fi folosite pentru a seta formatul de afișare pentru numerotarea listelor:
1. Atribute "I" sau "i" - lista este numerotata cu litere romane (majuscule sau mici);
2. Atribute „A” sau „a” – numerotare cu litere latine (majuscule sau mici);
3. Atributul „start” – este folosit pentru a se asigura că numerotarea nu începe de la primul articol, ca parametru fiind indicat numărul ordinal din care doriți să formați lista.Exemplu. O listă numerotată care este formată din litere romane și începe cu al doilea element:
- Primul articol din listă
- Al doilea articol din listă
- Al treilea articol din listă
- Al patrulea articol din listă
- Al cincilea articol din listă
Liste cu marcatori în HTML
Listele neordonate sunt numite și liste neordonate sau cu marcatori. Pentru a evidenția elementele unei astfel de liste, se folosesc caractere speciale (marcatoare). Tipul de marcatori de listă este specificat în codul HTML folosind atribute speciale. Un exemplu de listă cu marcatori în HTML:
- Primul articol din listă
- Al doilea articol din listă
- Al treilea articol din listă
- Al patrulea articol din listă
- Al cincilea articol din listă
În acest caz, lista va fi formată din markeri sub forma unui punct aldine. Atributele listei neordonate sunt:
1. „disc” - marcatori sub forma unui cerc umplut
2. „cerc” - marcatori sub forma unui cerc gol
3. „pătrat” - marcatori sub formă de pătrat umplutUn exemplu de setare a unui anumit marker într-o listă:
- Primul articol din listă
- Al doilea articol din listă
- Al treilea articol din listă
- Al patrulea articol din listă
- Al cincilea articol din listă
De asemenea, puteți utiliza imagini grafice ca marcatori de listă, ceea ce vă permite să creați un document HTML frumos. În practică, acest lucru este foarte des folosit. Pentru a îndeplini această sarcină, trebuie să scrieți calea către imagine în cod, care va servi drept marcator:
Primul articol din listă
De asemenea, listele pot fi imbricate, ele constau din mai multe liste:
- Primul articol din listă
- Al doilea articol din listă
- Primul subpunct al listei
- Al doilea subpunct al listei
- Al treilea articol din listă
- Al patrulea articol din listă
- Al cincilea articol din listă
Probabil că asta este tot ce am vrut să vă spun despre listele în HTML. Listele sunt foarte frecvente pe paginile web. Pentru a le forma, trebuie să cunoașteți anumite reguli de retragere.
- care indică elementele individuale ale listei oferă marcatori standard pentru elementele listei.
Parametrul COMPACT este scris fără valori și este folosit pentru a instrui browserul să afișeze această listă într-un format compact. De exemplu, fontul poate fi redus sau distanța dintre liniile listei etc.
Notă
În prezent, prezența parametrului COMPACT în etichetă
- nu afectează în niciun fel afișarea listelor de către browserele de top. Prin urmare, utilizarea acestui parametru este lipsită de sens, mai ales că utilizarea lui nu este recomandată de specificația HTML 4.0.
Parametrul TYPE poate lua următoarele valori: disc, cerc și pătrat. Acest parametru este folosit pentru a forța apariția marcatorilor de listă. Tipul exact de marcator va depinde de browserul utilizat. Opțiunile tipice de afișare sunt următoarele:
TIP = disc - marcajele sunt afișate cu cercuri umplute; TIP = cerc - marcajele sunt afișate cu cercuri deschise; TIP = pătrat - marcatorii sunt afișați cu pătrate umplute. Exemplu de înregistrare:
- .
Valoarea implicită este TYPE = disc. Pentru listele cu marcatori imbricate, valoarea implicită este disc la primul nivel, cerc la al doilea și pătrat la al treilea și mai departe. Este exact ceea ce se face în cele mai recente versiuni ale browserelor Netscape și Internet Explorer. Rețineți că alte browsere pot afișa markeri diferit. De exemplu, specificația HTML 4.0 specifică un contur pătrat pentru aspectul markerului afișat când TYPE = pătrat.
Parametrul TYPE cu aceleași valori poate fi utilizat pentru a specifica tipul de marcatori pentru elementele individuale ale listei. Pentru aceasta, parametrul TYPE cu valoarea corespunzătoare este permis să fie specificat în eticheta articolului din listă
- .
- - disc
- - cerc
În funcție de locul în care să specificați tipul de marcator, îl puteți modifica pentru întreaga listă sau pentru un anumit element.
Lista ordonata
Pentru a construi lista, aveți nevoie și de 2 elemente: „ol” și „li” (articol de listă). Marcatoarele sunt înlocuite cu numere punctate. Un exemplu de listă simplă:
Puteți controla aspectul unei liste ordonate specificând diferite tipuri de numerotare.
Tipuri de numerotare
Există un atribut de tip special care apare pe elementul „ol” sau „li”. Acesta este tipul listei dvs. Există 5 tipuri în total:
- - Numerotarea cu cifre arabe (1, 2, 3)
- - Numerotarea cu majuscule (A, B, C)
- - Numerotarea cu litere mici (a, b, c)
- - Numerotarea cu cifre romane mari (I, II, III)
- - Numerotarea cu cifre romane mici (i, ii, iii)
- - Cu ce cifră să începi numerotarea
În funcție de unde să specificați tipul de numerotare, o puteți modifica pentru întreaga listă sau pentru un anumit element.
Lista de definiții
A fost elaborată o listă de definiții pentru intrările din dicționar.
Există un container comun „dl”. În interiorul acestuia sunt „dt” (definiția termin) și „dd” (descrierea definiției). Cel mai simplu exemplu:
Toate elementele tuturor listelor sunt blocate. Dar în interiorul elementului „dt”, puteți pune doar elemente inline. Puteți pune orice doriți în elementele „dd” și „li”. Aici intervin listele imbricate.
Imbricate (liste mixte)
Acestea sunt liste pe mai multe niveluri, în cadrul cărora există o ierarhie. Astfel de liste sunt adesea folosite la construirea unui sitemap. Exemplu:
- Lista mixtă
Salutare dragi cititori ai site-ului blogului. Astăzi, în cadrul acestui titlu, vreau să vorbesc despre o varietate de liste Html care pot fi create pe baza etichetelor special concepute UL, OL, LI și DL. Cu ajutorul perechii UL și LI se creează liste marcate, cu ajutorul OL și LI - numerotate, iar cu ajutorul elementelor DL, DT și DD se creează așa-numitele liste de definiții. De asemenea, ne vom uita pe scurt la principiile creării structurilor imbricate.
Vreau să vă reamintesc că deja am reușit, am reușit să vorbim despre elementele de bază ale modernului, precum și despre aspectul tabelului (). În plus, am atins elementele de bază, ei bine, am învățat prin intermediul.
Liste cu marcatori bazate pe etichetele UL și LI
Eticheta UL este folosită pentru a crea liste cu marcatori, iar OL este folosit pentru a crea liste numerotate. Aceste etichete sunt împerecheate și blocate, la fel ca elementul LI.
Articole separate din listă sunt situate între etichetele de deschidere și de închidere, care la rândul lor sunt închise într-un element LI de deschidere și de închidere. În partea de sus și de jos a listelor HTML, browserul adaugă indentare pe o linie, similară cu indentarea creată de o etichetă de paragraf.
Să vedem, de exemplu, o variantă cu marcatori care ar putea arăta astfel:
În interiorul etichetelor UL de deschidere și de închidere, pot fi doar elemente LI și deja în interiorul acestor elemente (articole) în sine, puteți insera orice conținut (text, imagini, titluri, paragrafe, link-uri și chiar alte liste).
Acestea. UL servește doar la organizarea unei liste cu marcatori (neordonate), iar tot ceea ce veți vedea pe o pagină web în interiorul acesteia este implementat folosind conținutul elementelor LI.
Pentru UL, puteți schimba tipul de marker scriind diferite valori pentru atributul „Tip” în el. Dacă „Tipul” (controlul aspectului marcatorilor) nu este specificat pentru elementul UL, atunci va fi afișat tipul de marcator implicit (disc - un cerc umplut cu culoarea textului):
În exemplele de mai sus, am scris atributul „Tip” în elementul UL, aplicând acest tip de marcatori tuturor articolelor. Dar atributul „Tip” poate fi atribuit fiecărei etichete LI individuale, setând propriul tip de marcator pentru acest articol.
Un exemplu de listă cu marcatori cu diferite tipuri de marcatori pentru fiecare articol:
Liste numerotate în HTML pe baza etichetei OL
Pentru a crea o listă numerotată se folosesc etichete OL, în interiorul cărora, din nou, vor fi amplasate elemente LI. OL și LI, așa cum am menționat deja, sunt bloc (adică tind să ocupe tot spațiul disponibil în lățime) și în interiorul OL nu se va putea plasa altceva decât elemente LI.
Se pare că OL și UL sunt etichete de serviciu care sunt necesare doar pentru a spune browserului ce fel de listă generăm (marcate sau numerotate). În cazul unuia numerotat, în stânga fiecărui element vom vedea nu un marker, ci un număr și un punct în spatele lui:
După cum am menționat mai sus, elementele UL, OL și LI au capacitatea de a utiliza atributul TYPE. Vă permite să personalizați tipul de marcator sau să specificați ce numere sau litere vor fi numerotate articole din listă. Pentru o listă numerotată, parametrii acestui atribut pot lua următoarele valori:
Un exemplu de listă numerotată cu diferite tipuri de numerotare pentru fiecare articol:
La crearea listelor numerotate, este posibil să începeți numerotarea nu de la unul, ci de la numărul specificat în atributul START. De exemplu:
Pentru OL, puteți începe o nouă numerotare de la orice valoare, începând de la orice articol, prin scrierea atributului VALOARE cu numărul necesar în LI de deschidere a acestui articol. De exemplu:
Liste de stiluri în CSS (Foi de stil)
Dar, de regulă, acum aspectul markerilor este setat nu prin atributul TYPE, ci pentru care sunt scrise proprietățile corespunzătoare.
Aici voi da doar un exemplu de marcatori diferite pentru liste nenumerotate, al căror aspect este stabilit printr-un fișier separat cu foi de stil în cascadă.
Dar despre asta vom vorbi în articolele următoare. Așa se stabilește aspectul markerilor UL pe acest blog. Imaginile sunt folosite ca marcatori: pentru articolele obișnuite ale unei liste nenumerotate -, pentru articolele imbricate ale unei liste nenumerotate -.
Liste speciale și imbricate în cod HTML
Al treilea și ultimul tip se numește „liste de definiții” și sunt specificate folosind trei etichete - DL, DT și DD. DL-ul spune browserului că va urma o listă de definiții.
De obicei, acest tip este folosit (bine, sau se presupunea că va fi folosit) pentru scrierea intrărilor de dicționar, constând din termeni (închiși în etichete DT) și descrierile acestora (închiși în etichete DD).
Dacă te uiți la exemplul de mai sus, vei observa că elementul DD (descrierea termenului) este decalat (cu 40 de pixeli) față de elementul DT (termenul însuși).
În general, DL, DT și DD sunt etichete de bloc, în plus, în interiorul unui element DT poate fi introdus doar conținut cu etichete inline (se dovedește că în interiorul unui DT nu se va putea folosi elemente de titlu și paragraf de bloc). Și în interiorul etichetelor DD, puteți insera orice elemente, atât inline, cât și bloc.
Listă imbricatăîn Html este creat prin analogie cu unul simplu, dar în interiorul listei principale, unele dintre articole sunt din nou incluse în etichetele UL sau OL de deschidere și de închidere.
Vă rugăm să rețineți că LI-ul de închidere al articolului în care va fi creat elementul imbricat este plasat numai după întregul cod al listei imbricate (acest lucru este foarte important pentru afișarea corectă a acestuia pe pagina web). Lista imbricată ar putea arăta cam așa:
Multă baftă! Ne vedem curând pe paginile site-ului blogului
S-ar putea să fiți interesat
Cum să inserați un link și o imagine (foto) în etichetele HTML - IMG și A Selectare, Opțiune, Zona de text, Etichetă, Set de câmpuri, Legendă - Etichete HTML ale formularului derulant și casetă de text 
Formulare HTML pentru site - etichete Form, Input and Select, Option, Textarea, Label și altele pentru crearea elementelor formularelor web 
Cum sunt setate culorile în codul Html și CSS, selecția nuanțelor RGB în tabele, Yandex și alte programe 
Embed and object - Etichete HTML pentru afișarea conținutului media (video, flash, audio) pe paginile web 
Etichete și atribute ale titlurilor H1-H6, linie orizontală Hr, întrerupere de linie Br și paragraful P conform standardului Html 4.01 
Tabele în HTML - etichete Table, Tr și Td, precum și Colspan, Cellpadding, Cellspacing și Rowspan pentru a le crea 
Ce este limbajul de marcare hipertext HTML și cum să vizualizați o listă cu toate etichetele în validatorul W3C 
Font (față, dimensiune și culoare), etichete Blockquote și pre sunt formatări de text vechi în HTML pur (fără CSS) 
Iframe și Frame - ce sunt acestea și cum să folosiți cel mai bine cadrele în HTML 
Img - Etichetă HTML pentru inserarea unei imagini (Src), alinierea și împachetarea acesteia cu text (alinierea), precum și setarea unui fundal (fundal)
Unul dintre tipurile de liste implementate în HTML este o listă cu marcatori. În caz contrar, listele de acest tip se numesc neordonate sau neordonate. Cel din urmă nume este adesea folosit ca o traducere formală a numelui etichetei corespunzătoare.
- , cu ajutorul cărora listele de acest tip sunt organizate în documente HTML (UL - Unordered List, neordenată).
O listă cu marcatori folosește caractere speciale numite marcatori de listă (deseori numite marcatori, care este pronunția formală a termenului englezesc bullet) pentru a-și evidenția elementele. Tipul de marcatori de listă este determinat de browser, iar atunci când se creează liste imbricate, browserele vor diversifica automat aspectul marcatorilor la diferite niveluri de imbricare.
Etichete și
Pentru a crea o listă cu marcatori, trebuie să utilizați o etichetă de container, în interiorul căreia se află toate elementele listei. Etichetele listei de deschidere și închidere furnizează fluxuri de rând înainte și după listă, separând astfel lista de conținutul principal al documentului, astfel încât nu este nevoie să folosiți etichete de paragraf aici.
.
Fiecare element din listă trebuie să înceapă cu o etichetă
