BluePink BluePink
XHost
Gazduire site-uri web nelimitata ca spatiu si trafic lunar la doar 15 eur / an. Inregistrare domenii .ro .com .net .org .info .biz .com.ro .org.ro la preturi preferentiale. Pentru oferta detaliata accesati site-ul BluePink

4. Liste

In HTML se pot defini trei tipuri de liste: numerotate, cu marcatori si de definitii.

4. 1. Liste numerotate

Se folosesc pentru introducerea clasamentelor sportive, muzicale, etc. sau pentru descrierea pasilor unei operatii. Numerele dinaintea elementelor sunt generate automat. O lista numerotata se precizeaza dupa modelul:

< OL > <LI>element 1</LI> <LI>element 2</LI>. . . <LI>element n</LI> </OL>

unde element 1. . . element n pot fi texte sau alte etichete HTML (pentru texte, imagini, legaturi, etc.).

Exemplu:

<HTML> <HEAD><TITLE>Lista numerotata</TITLE> </HEAD>
<H1>Mari artisti</H1><HR>
<OL><LI>Henry Purcell</LI>
<LI>Enya</LI>
<LI>Gheorghe Zamfir</LI></OL>
</BODY></HTML>

Tipul de numerotare

Numerotarea elementelor se poate face cu numere, litere sau cifre romane, folosind atributul TYPE, dupa modelul:

<OL TYPE =”tip”>

unde ti p poate fi: 1 (numere standard), a (litere mici), A (litere mari), i (cifre romane mici), I (cifre romane mari).

De asemenea, pentru ca numerotarea sa nu inceapa de la 1, ci de la un anumit numar, folosim atributul START. De exemplu, <OL START=”10”) inseamna ca dorim ca numerotarea sa inceapa cu 10.

4. 2. Liste cu marcatori

Se folosesc daca nu dorim ca elementele listei sa fie numerotate, ci doar sa apara inaintea lor un mic simbol grafic (marcator – bullet). Aceste liste se numesc liste neordonate (unordered lists) si se definesc cu etichetele <UL> si <LI>, astfel:

< UL > <LI>element 1</LI> <LI>element 2</LI>. . . <LI>element n</LI> </UL>

Exemplu: acelasi cu cel de mai sus, inlocuind OL cu UL.

Modificarea tipului de marcator

HTML permite trei tipuri de marcatori: cercul (marcatorul standard), discul (cerc plin) si patratul. Pentru precizarea marcatorului se adauga atributul TYPE, dupa modelul:

<UL TYPE =”tip”>

unde tip poate fi: circle, disc sau square.

Culoarea marcatorului

Se stabileste cu atributul STYLE, dupa modelul <UL STYLE="color: 'culoare'">, unde culoare este culoarea dorita. Exemplu:

<UL STYLE="color: 'red'">

@ Deseori se intalnesc in paginile web, mici imagini pe post de marcatori, cum vom arata la lucrul cu imagini.

4. 3. Liste de definitii

Se folosesc pentru crearea unor liste asemanatoare dictionarelor, continand anumite cuvinte sau expresii si, sub fiecare, definitia corespunzatoare, indentata spre interior. Listele de definitii se construiesc dupa modelul:

<DL>
<DT>termen</DT><DD>definitie</DD>
. . .
<DT>termen</DT><DD>definitie</DD>
</DL>

Exemplu:

<HTML> <HEAD><TITLE>Lista de definitii</TITLE> </HEAD>
<H1><FONT COLOR="red">Mari artisti</FONT></H1><HR>
<DL>
<DT><B>Henry Purcell</B></DT><DD>Trumpet voluntary, Strike the viol, Jubilate Deo</DD>
<DT><B>Enya</B></DT><DD>Caribbean blue, Only time, Storms in Africa, Aldebaran, Flora's secret</DD>
<DT><B>Gheorghe Zamfir</B></DT><DD>Czardas, Hora ca la caval, Lonely shepard, Aranjuez mi amor</DD>
</DL></BODY></HTML>

@ Listele de definitii se pot folosi si pentru altceva decat definitii – de exemplu, pentru crearea unor antete de sectiune, urmate de textul indentat spre interior, sau numai pentru obtinerea unui text indentat (se omite termenul si se completeaza doar definitia).

4. 4. Combinarea listelor

Este posibila folosirea unei liste ca element in alta lista – in acest caz prima numindu–se lista imbricata (nested list – denumirea provenind din englezescul „nest”=”cuib”) .

Exemplu:

<HTML> <HEAD>
<TITLE>Liste imbricate</TITLE> </HEAD>
<H1><FONT COLOR="red">Mari artisti</FONT></H1><HR>
<DL>
<DT><B>Henry Purcell</B></DT>
<DD>Mare compozitor englez (1659-1695).<BR>Piese:
<UL><LI>Trumpet voluntary,</LI><LI>Strike the viol,</LI><LI>Jubilate Deo</LI></UL></DD>
<DT><B>Enya</B></DT>
<DD>S-a nascut in Irlanda pe 17.05.1961, in zodia Taurului.<BR>Piese:
<OL><LI>Caribbean blue, </LI><LI>Only time,</LI><LI> Storms in Africa,</LI>
<LI> Aldebaran,</LI><LI>Flora's secret</LI></OL></DD>
<DT><B>Gheorghe Zamfir</B></DT>
<DD>S-a nascut la Gaesti, Romania, pe 6 aprilie 1941, in zodia Berbecului.<BR>Piese:
<UL TYPE="disc"> <LI> Lonely shepard,</LI><LI>Aranjuez mi amor,</LI>
<LI>Czardas,</LI><LI>Hora ca la caval</LI></UL></DD>
</DL>
</BODY></HTML>

Incercati:

1. Realizati o lista cu primele 4 materii de studiu preferate in scoala, folosind, pe rand:

2. Transformati lista de mai sus in lista de definitii, termenii fiind materiile studiate iar ca definitii, motivele pentru care preferati materiile respective.

3. Descrieti o reteta culinara, folosind liste.