Prof.

Liliana chiopu

LISTE IN HTML

Cuprins
1. Tipuri de liste
2. List neordonat. Exemplu
3. List ordonat. Exemplu

4. Liste de definiii. Exemple

5. Sintaxa general a listelor
6. Crearea listelor neordonate
7. Crearea listelor ordonate
8. Crearea listelor de definiii
9. Liste imbricate
10. Bibliografie

Tipuri de liste
Exista 3 tipuri de liste:
1. Liste neordonate
2. Liste ordonate (sau numerotate)
3. Liste de definiii

1.List neordonat. Exemplu

Merele sunt verzi

Bananele sunt galbene
Portocalele sunt portocalii

2.List ordonat. Exemplu

O list ordonat cuprinde intrri
marcate ntr-un mod care s sugereze
ordonarea lor:
1. Aprindei pocnitoarea.
2. Aruncai-o.

3.Liste de definiii. Exemple

Acestea sunt folosite n cazul cnd fiecare element al listei are
nevoie de un sumar, urmat de o descriere mai detaliat. De
exemplu:
Paris, Frana
Capitala Franei. Printre atracii se numar turnul Eiffel i
catedrala Notre Dame.
Sydney, Australia
Capitala statului New South Wales, Australia. Atracii:
Opera i podul Harbour.
Londra, Anglia
Capitala Angliei. Obiective turistice: Tower Bridge i Big
Ben.

Sintaxa general a listelor

<LI [VALUE=nnnn] [TYPE=1|a|A|i|I|disk|square|circle]>
element-de-lista
[</LI>]
specific un element ntr-o lista ordonat, neordonat

Sintaxa general a listelor

VALUE indic valoarea numeric de nceput pentru o list
ordonat. Implicit este 1 si nu trebuie specificat la orice
intrare LI ci numai dac o list este ntrerupt printr-un alt
text, necesitnd un alt nceput de numerotare;
TYPE permite (nu n toate browserele) s se fixeze stilul pentru
buline sau pentru numerotri:
1 - numr arabic (implicit);
a - litere mici;
A - litere mari;
i - numr roman mic (i, iv etc.);
I - numr roman mare (I, IV etc.);

Sintaxa general a listelor

disk - cerc plin (implicit pentru liste neordonate);
square - ptrat plin;
circle - cerc gol;
element-de list poate fi orice (hiper)text.
Deoarece dup continutul containerului LI ncepe un alt tag LI,
sau se termin o list, terminatorul de tag nu este
obligatoriu.
Este inserat automat un sfrsit de paragraf la terminarea unui
tag LI.

Crearea listelor neordonate

Pentru a crea o list neordonat folosim tag-urile
<UL></UL>; la nceputul i sfritul listei i <LI></LI>
pentru fiecare element.
Pentru exemplul de mai sus, codul HTML este:
<ul>
<li> Merele sunt verzi </li>
<li> Bananele sunt galbene </li>
<li> Portocalele sunt portocalii </li>
</ul>
(Tag-urile </LI> sunt opionale, dar le vom folosi pentru a evita
ambiguitile.)

Crearea listelor ordonate

Pentru listele ordonate (numerotate), metoda
este aceeasi, cu singura deosebire ca tag-urile
folosite vor fi <OL></OL> in loc de

<UL></UL>.
Pentru exemplul de mai sus, codul este:
<ol>
<li> Aprindeti pocnitoarea.</li>
<li> Aruncati-o.</li>
</ol>

Crearea listelor de definiii

Lista va fi creat folosind tag-urile <DL> i
</DL> pentru nceput i sfrit. Fiecare
element al listei este alctuit dintr-un termen

creat cu ajutorul tag-urilor <DT></DT> i

definiia propriu-zis pentru care sunt folosite
tag-urile <DD></DD>.

Crearea listelor de definiii

Codul pentru exemplul de mai sus este:
<dl>
<dt><strong>Paris, Franta</strong></dt>
<dd> Capitala Frantei. Printre atractii se numara
turnul Eiffel si catedrala Notre Dame. </dd>
<dt><strong>Sydney, Australia</strong></dt>
<dd> Capitala statului New South Wales, Australia.
Atractii: Opera si podul Harbour. </dd>
<dt><strong>Londra, Anglia</strong></dt>
<dd> Capitala Angliei. Obiective turistice: Tower Bridge
si Big Ben. </dd>
</dl>

Liste imbricate
Este posibil ca n cadrul unei liste s avem o alt
list. De exemplu, o list cu dou niveluri poate fi:
1. Capitolul 1
1. Seciunea 1.1
2. Seciunea 1.2
2. Capitolul 2
1. Seciunea 2.1
2. Seciunea 2.2
3. Seciunea 2.3

Liste imbricate
Codul HTML pentru crearea listei de mai sus este:

<ol>
<li>Capitolul 1
<ol>
<li> Sectiunea 1.1</li>
<li> Sectiunea 1.2</li>
</ol>
</li>
<li>Capitolul 2

<ol>
<li> Sectiunea 2.1</li>
<li> Sectiunea 2.2</li>
<li> Sectiunea 2.3</li>
</ol>
</li>
</ol>

Liste imbricate
Pot fi imbricate tipuri diferite de liste. n exemplul urmtor,
liste ordonate i cele neordonate sunt definite n cadrul unei
liste de definiii.

Liste imbricate
Codul HTML este:
<dl>

<dt><strong>Fructe</strong>

<dt><strong>Instructiuni
pentru artificii</strong></dt>

</dt>

<dd>

<dd>
<ul>

<li> Merele sunt verzi </li>

<li> Bananele sunt galbene </li>
<li> Portocalele sunt portocalii
</li>
</ul>
</dd>

<ol>
<li>Aprindeti
pocnitoarea.</li>
<li>Aruncati-o.</li>
</ol>
</dd>
</dl>

Bibliografie
http://www.e-learn.ro/tutorial/html/v-

liste/74/1/121.htm
http://profs.info.uaic.ro/~val/liste.html