HTML pune la dispozitie trei tipuri de liste: <ul> lista neordonata,<ol> va afisa o lista ordonata, iar pentru a realiza o lista de definitii se foloseste <dl>.
Legenda:
ul = unordered list
ol = ordered list
li = list item
dl = definition list
dt = term in a definition list
dd = description of a term in a definition list
O lista neordonata este un bloc de text delimitat de etichetele corespondente <ul>...</ul> (" ul " vine de la " unordered list " = lista neordonata). Fiecare element al listei este inițiat de eticheta <li> (list item).
Lista va fi intentata fata de restul paginii Web și fiecare element al listei incepe pe un rând noua.
<html>
<head>
<title>Liste_ex2</title>
</head>
<body><h1 align="center">O lista neordonata</h1><hr>
Glosar de termeni de World Wide Web
<ul>Culori uzuale disponibile prin nume
<li>Black
<li>White
<li>Red
<li>Green
<li>Blue
<li>Yellow
<li>Purple
<li>Aqua
</ul>
</body>
</html>
Tag-urile <ul> și <li> pot avea un atribut type care stabilește caracterul afișat în fața fiecărui element al listei. Valorile posibile al acestui atribut sunt:
"circle" (cerc)
"disc" (disc plin) (valoarea prestabilita);
"square" (pătrat)
Listele neordonate pot fi imbricate pe mai multe niveluri
<html>
<head>
<title>Liste_ex3</title>
</head>
<body>
<h1 align="center">O lista neordonata de liste neordonate</h1>
<hr>
Glosar de termeni de World Wide Web
<ul>Elemente și atribute a unei pagini HTML
<li>Frameset
<ul>Atribute:
<li>cols
<li>rows
<li>border
</ul>
<li>Frame
<ul>Atribute:
<li>src
<li>name
<li>scrolling
</ul>
</ul>
</body>
</html>
Liste ordonate
O listă ordonată de elemente este un bloc de text delimitat de etichetele corespondente <ol>...</ol> (" ol " vine de la " ordered list " = lista ordonată). Fiecare element al listei este inițiat de eticheta <li> (list item).
Lista va fi identată față de restul paginii Web și fiecare element al listei incepe pe un rând nou.
<html>
<head>
<title>listex_4</title>
</head>
<body>
<h1 align="center">O lista ordonata</h1>
<hr>
<ol>Culori uzuale disponibile prin nume
<li>Black
<li>White
<li>Red
<li>Green
<li>Blue
<li>Yellow
<li>Purple
<li>Aqua
</ol>
</body>
</html>
Tag-urile <ol> și <li> pot avea un atribut type care stabilește tipul de caractere utilizate pentru ordonarea listei. Valorile posibile sunt:
" A " pentru ordonare de tipul A , B , C , D etc. ( litere mari );
" a " pentru ordonare de tipul a , b , c , d etc. ( litere mici );
" I " pentru ordonare de tipul I , II , III , IV etc. ( cifre romane mari );
" i " pentru ordonare de tipul i , ii , iii , iv etc. ( cifre romane mici );
" 1 " pentru ordonare de tipul 1 , 2 , 3 , 4 etc. ( cifre arabe - opțiune prestabilita );
Listele ordonate pot fi imbricate intre ele sau cu liste neordonate, ca în exemplul următor:
<html>
<head><title>listex_8</title></head>
<body><h1 align="center">O lista ordonata de liste ordonate și neordonate</h1><hr>
<ol>Un sistem informatic include:
<li>Hardware:
<ol>
<li>placa de baza
<li>procesor
<li>memorie
<li>harddisk
</ol>
<li>Software:
<ul>
<li>Linux
<li>Windows
<li>OS/2
<li>Unix
</ul>
<li>Software de aplicatie:
<ul type="disc">
<li>VisualC++
<li>Java
<li>SQL
<li>CorelDraw
</ul>
</ol>
</body>
</html>
Liste de definitii
Aceste liste sunt delimitate de etichetele <dl> si </dl>. Termenii listei sunt delimitati de etichetele <dt> si </dt>, iar definitiile termenilor de <dd> si </dd>.
Cod HTML
Lista de definitie
<dl>
<dt> ROM
<dd> Read Only Memory
<dt> RAM
<dd> Random Access Memory
</dl>
Rezultat
Aplicație Creați:
1. Lista neordonata la care marcatorul e de tip patrat
§ element 1
§ element 2
§ element 3
2. Lista ordonata cu litere mari:
c.element 1
d.element 2
e.element 3
3.Lista de definitie:
Fromage
Cuvant francez pentru branza .
Voiture
Cuvant francez pentru masina