Definirea si utilizarea listelor
HTML ofera mai multe mecanisme prin care sa se poata defini liste de informatii, avînd în vedere larga utilizare a acestora. Exista mai multe feluri de liste, toate avînd însa cîteva elemente comune:
Întreaga lista este încadrata de tag-uri de început si de sfîrsit de lista: <UL> si </UL>, <OL> si </OL>, etc.
Fiecare element al listei are propriul lui tag: <DT> si <DD> pentru listele glosar si <LI> pentru toate celelalte liste.
Exista trei tipuri standard de liste: neordonate (UL), ordonate (OL) si liste de definitii (DL). Se mai pot defini si liste de tip MENU si DIR (definite initial în 2.0) dar care sînt acum considerate depasite si vor fi afisate la fel ca UL si DL.
Sintaxa:
<OL>
<LI> Primul element al listei ordonate
<LI> Al doilea element
<LI> A1 treilea element...
</OL>
Atribute posibile:
TYPE=[ 1 | a | A | i | I ] (stilul de numerotare)
START=Number (numarul de început al elementelor)
COMPACT (afisare compacta)
atribute comune
Contine:
unul sau mai multe elemente LI
Continut în:
APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD, TH
Descriere:
Listele ordonate încep cu <OL> si se încheie cu </OL> (OL este o abreviere de la Ordered List) si fiecare element este introdus în lista cu ajutorul tag-ului vid <LI>. Cînd navigatorul interpreteaza o lista ordonata el numeroteaza secvential fiecare element întîlnit (nu se numeroteaza în document). Identarea în textul original (cel ce va fi afisat) nu este obligatorie, folosindu-se doar pentru a putea fi mai usor reperate listele din restul textului.
Atributul TYPE sugereza stilul de numerotare. Valorile pe care le poate lua sînt (literele mici difera de cele mari):
1 (numere zecimale: 1, 2, 3, 4, 5, ...)
a (literele mici ale alfabetului: a, b, c, d, e, ...)
A (literele mari ale alfabetului: A, B, C, D, E, ...)
i (numerele Romane scrise cu litere mici: i, ii, iii, iv, v, ...)
I (numerele Romane scrise cu litere mari: I, II, III, IV, V, ...)
Atributul START indica primul numar folosit la numerotarea elementelor listei.
Exemplu:
Prepararea unei cani de ceai.
<OL>
<LI> Puneti apa la fiert
<LI> Puneti ceaiul preferat într-o cana de portelan
<LI> Turnati apa fierbinte peste ceai si acoperiti cana
<LI> Asteptati 3 minute
</OL>
Sintaxa
<UL>
<LI> Primul element al listei neordonate
<LI> Al doilea element
<LI> A1 treilea element...
</UL>
Atribute posibile:
TYPE=[ disc | square | circle ] (stilul bulletului folosit pentru elemente)
COMPACT (afisare compacta)
atribute comune
Contine:
unul sau mai multe elemente LI
Continut în:
APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD, TH
Descriere:
Diferenta fasa de lista ordonata (OL) este ca elementele nu vor apare numerotate, ele fiind afisate identat, unele sub altele, precedate de un semn specific elementelor listelor (de exemplu bulina .). Acest semn este determinat de atributul TYPE si poate lua valorile:
disc (cerc umplut/plin)
square (patrat)
circle (circumferinta unui cerc)
![]() | ![]() | ![]() |
Exemplu: Un meniu la restaurant poate fi descris astfel:
<UL>
<LI> Ciorba de burta
<LI> Ciorba de perisoare
<LI> Alte ciorbe
</UL>
Listele neordonate trebuie marcate cu tag-urile <UL> iar elementele listei se introduc la fel ca în listele ordonate. Rezultatul este o lista ale carei elemente sînt marcate cu buline sau alte caractere (daca "nivelul" pe care apar este mai mare de 1). Forma lor (pentru sub-liste) poate fi schimbata definind o noua lista în interiorul primeia, dupa modelul urmator:
<UL>
<UL>
<LI> Element al noii liste
<LI> Un alt element, etc
</UL>
</UL>
Sintaxa:
<LI> Element al listei... </LI>
Atribute posibile:
TYPE=[ disc | square | circle | 1 | a | A | i | I ] (stilul de marcare a elementelor listei)
VALUE=Number (numarul elementului din secventa)
atribute comune
Contine:
elemente inline si elemente de tip bloc (bloc level)
Continut în:
OL, UL, MENU, DIR
Descriere:
Elementele listelor se definesc folosind acest tag. Atributul VALUE poate specifica numarul din secventa care se "atribuie" acelui element. Atributul TYPE specifica elementul grafic/alfabetic ce va marca elementul respectiv. Valorile pe care le poate lua sînt:
Valorile pentru LI în UL, DIR sau MENU:
disc (cerc umplut/plin)
square (patrat)
circle (circumferinta unui cerc)
Valorile pentru LI în OL:
1 (numere zecimale: 1, 2, 3, 4, 5, ...)
a (literele mici ale alfabetului: a, b, c, d, e, ...)
A (literele mari ale alfabetului: A, B, C, D, E, ...)
i (numerele Romane scrise cu litere mici: i, ii, iii, iv, v, ...)
I (numerele Romane scrise cu litere mari: I, II, III, IV, V, ...)
Sintaxa:
<DL>
<DT> Termen care urmeaza sa fie definit </DT>
<DD> Definitia termenului </DD>
<DT> Alt termen </DT>
<DD> Alta definitie </DD>
</DL>
Atribute posibile:
COMPACT (afisare compacta)
atribute comune
Contine:
unul sau mai multe elemente DT sau DD
Continut în:
APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD, TH
Descriere:
Listele de definitii (uneori numite si liste glosar) sînt usor diferite fata de celelalte liste. Fiecare element al listei este format din doua parti: termenul de definit si definitia. Listele de definitii încep cu <DL> si se termina cu </DL>. Termenii care trebuie definiti sînt inserati cu ajutorul etichetei <DT> iar definitiile corespunzatoare se introduc cu ajutorul etichetei <DD>.
O lista de definitii poate avea mai multi termeni pentru o definitie data, precum si mai multe definitii pentru un termen. De asemenea se poate da un termen fara o definitie corespunzatoare si vice versa (!), dar o astfel de structura are sens în cazuri extrem de rare.
Listele de definitii sînt formatate de navigatoare astfel încît termenii si definitiile sînt separati prin linii iar marginile definitiilor sînt identate. Cu ajutorul atributului COMPACT, <DL COMPACT>, lista de definitii ar trebui sa fie formatata pe o suprafata ecran mai mica. Se pare însa ca majoritatea navigatoarelor ignora acest atribut.
O lista de acest tip poate fi adaptata si pentru utilizarea cu structuri care nu sînt termeni stricti si definitii (în sensul uzual), aceasta practica fiind justificata cînd alte elemente HTML nu pot descrie adecvat acea structura. De exemplu, o lista cu programul unei persoane dintr-o saptamîna ar putea fi definita astfel:
<H1>Programul saptamînal</H1>
<DL CLASS=calendar>
<DT>21 ianuarie</DT>
<DD>
Minerii din Valea Jiului prezinta <CITE>Lupta cu jandarmii</CITE> în comuna Costesti. Trebuie vazuta.
</DD>
<DT>22 ianuarie</DT>
<DD>
Marius Tuca Show, de la 7:00 la
9:00, invitatie la <ABBR TITLE=Street>
</DD>
</DL>
Sintaxa:
<DT> Element al listei... </DT>
Atribute posibile:
atribute comune
Contine:
elemente inline
Continut în:
DL
Descriere:
DT defineste un termen într-o lista de definitii. Tagul de sfîrsit este optional dar se recomanda a fi folosit pentru a preveni anumite erori cînd se folosesc stilurile (style-sheets). DT nu poate contine elemente de tip bloc (ca de exemplu P sau Hn). În general tagul este urmat de un element DD pentru denirea termenului respectiv. Un termen poate avea mai multe definitii asociate cu el, dupa cum si o singura definitie poate avea mai multi termeni.
Sintaxa:
<DD> Element al listei... </DD>
Atribute posibile:
atribute comune
Contine:
elemente inline si elemente de tip bloc (bloc level)
Continut în:
DL
Descriere:
Elementul DD ofera definitia unui termen dintr-o lista de definitii. Tagul de sfirsit este optional dar se recomanda a fi folosit pentru a preveni anumite erori cînd se folosesc stilurile (style-sheets). DT poate contine elemente de tip bloc (ca de exemplu P, Hn, TABLE sau chiar DL). Astfel listele de definitii pot fi îmbricate.
Sintaxa:
<MENU>
<LI> Primul element din meniu
<LI> Al doilea element din meniu
<LI> Al treilea element din meniu
</MENU>
<DIR>
<LI> fisiere/
<LI> aplicatii/
<LI> posta/
</DIR>
Descriere:
Meniurile sînt liste simple de elemente sau scurte paragrafe care nu sînt inserate cu ajutorul numerelor sau bulinelor. Afisarea lor se face prin identare diferita sau o formatare diferita de restul textului. Listele director sînt si mai scurte decît listele meniu, sînt identate si formatate în coloane de catre navigatoare, în mod asemanator listelor director din Unix. Meniurile au fost proiectate pentru a fi folosite ca liste cu o singura coloana.
În practica un browser va afisa listele definite cu DIR si MENU exact ca cele definite cu UL!
Imbricarea listelor se realizeaza simplu: se insereaza o noua lista în interiorul primei liste. Se pot insera liste neordonate în interiorul celor ordonate si viceversa. Felul în care apar afisate listele imbricate difera mult de la un navigator la altul.
Exemplu: Meniul (mai complet) de la restaurant:
<OL>
<LI> Ciorbe
<UL>
<LI> Ciorba de burta
<LI> Ciorba de perisoare
<LI> Alte ciorbe
</UL>
<LI> Felul doi
<LI> Desert
</OL>
Pentru liste, navigatorul este acela care hotaraste forma bulinelor sau schema de numerotare. Netscape a introdus cîteva atribute prin care se ofera un mai mare control asupra tipurilor de buline utilizate pentru marcarea elementelor din listele neordonate.
Atributul TYPE determina forma "bulinei":
TYPE=DISC, pentru o bulina circulara, compacta (implicita)
TYPE=CIRCLE, pentru un contur circular
TYPE=SQUARE, pentru un contur de forma unui patrat
Exemplu:
<UL>
<LI TYPE=DISC >Disc
<LI TYPE=CIRCLE>Cerc
<LI TYPE=SQUARE>Patrat
</UL>
Pentru listele ordonate, atributul TYPE are un alt set de valori care indica schema de numarare:
TYPE=1, implicit, ordoneaza elementele listei prin numere arabe (1, 2, 3,...)
TYPE=A, ordoneaza elementele listei prin litere mari (A, B, C, ...)
TYPE=a, ordoneaza elementele listei prin litere mici (a, b, c, ...)
TYPE=I, ordoneaza elementele listei prin numere romane mari (I, II, III, ...)
TYPE=i, ordoneaza elementele listei prin numere romane mici (i, ii, iii, ...)
|