CATEGORII DOCUMENTE |
Liste
Unul din cele mai obisnuite elemente din documentele cu mai multe pagini este un set de definitii, referinte sau indexuri. Glosarele sunt exemple clasice in acest sens; cuvintele sunt listate in ordine alfabetica, urmate de definitii ale termenilor respectivi. In HTML, intreaga sectiune a unui glosar va fi gestoinata printr-o lista de definitii, care este inclusa intr-o pereche de marcaje de lista de definitii: <dl></dl> (de la 'definition list' = lista de definitii).
Observatii:
- Un termen al listei este initiat de eticheta <dt> (de la 'definition term' = termen definit);
- Definitia unui termen este initiata de eticheta <dd> (de la 'definition description' = descrierea definitiei);
- Definitia unui termen incepe pe o linie noua si este indentata;
<html> <head><title>listex_1</title></head> <body><h1
align='center'>O lista de
definitii</h1><hr> <dl>
Glosar de termeni de World Wide Web
<dt><b>hypertext</b> <dd>- o interconectare Web de informatii de tip text, in care orice
cuvant sau fraza poate face legatura catre un alt punct din document sau catre
un alt document
<dt><b>date</b> <dd>- fluxul nesfarsit de materiale care apar pe Internet, spre
deosebire de informatii care sunt date cu un anumit inteles sau valoare
<dt><b>informatie</b> <dd>- sub-setul de date care are efectiv semnificatie si care este
util la momentul curent
</dl> </body> </html>
Liste neordonate
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
initiat de eticheta <li> (list item).
Lista va fi indentata fata de restul paginii Web si
fiecare element al listei incepe pe un rand noua.
<html> <head><title>listex_2</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> si <li> pot avea un atribut type care stabileste caracterul afisat in fata fiecarui element al listei. Valorile posibile al acestui atribut sunt:
Listele neordonate pot fi imbricate pe mai multe niveluri
<html> <head><title>listex_3</title></head> <body><h1
align='center'>O lista neordonata
de liste neordonate</h1><hr>
Glosar de termeni de World Wide Web
<ul>Elemente si 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 lista ordonata
de elemente este un bloc de text delimitat de etichetele corespondente <ol></ol>
(' ol ' vine de la ' ordered list
' = lista ordonata). Fiecare element al listei este
initiat de eticheta <li> (list item).
Lista va fi indentata fata de restul paginii Web si
fiecare element al listei incepe pe un rand noua.
<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> si <li> pot avea un atribut type care stabileste tipul de caractere utilizate pentru ordonarea listei.Valorile posibile sunt:
Urmatorul exemplu este o lista ordonata cu cifre romane
<html> <head><title>listex_5</title></head> <body><h1
align='center'>O lista ordonata
cu cifre romane</h1><hr>
<ol
type='I'>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-ul <ol> poate avea un atribut start care stabileste valoarea initiala a secventei de ordonare.Valoarea acestui atribut trebuie sa fie un numar intreg pozitiv.
Urmatorul exemplu este o lista ordonata cu litere mari, incepand de la valoarea C.
<html> <head><title>listex_6</title></head> <body><h1
align='center'>O lista ordonata
cu litere mari, incepand de la valoarea C</h1><hr> <ol
type='A' start='3'>Culori
uzuale disponibile prin nume
<li>Red <li>Green <li>Blue <li>Yellow <li>Purple <li>Aqua
</ol> </body> </html>
Tag-ul <li> poate avea un atribut value care satileste valoare pentru elementul respectiv al listei. Valoarea acestui atribut trebuie sa fie un numar intreg pozitiv (vezi urmatorul exemplu).
<html> <head><title>listex_7</title></head> <body><h1
align='center'>O lista ordonata
avand itemi setati individual</h1><hr>
<ol
start='3'>Repetati urmatorii pasi
ai algoritmului
<li>salvati fisierul;
<li
value='6'>incarcati fisierul in
browser;
<li>schimbati browserul utilizat
<li>incarcati din nou fisierul
</ol> </body> </html>
Listele ordonate pot fi imbricate intre ele sau cu liste neordonate, ca in exemplul urmator.
<html> <head><title>listex_8</title></head> <body><h1
align='center'>O lista ordonata
de liste ordonate si 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>
O lista de meniuri este un bloc delimitat de etichete corespondente <menu></menu>. Fiecare element al listei este initiat de eticheta <li> ( list item ). Cele mai multe browsere afiseaza lista de meniuri ca pe o lista neordonata.
O lista de directoare este un bloc delimitat de etichete corespondente <dir></dir> (de la ' director '). Fiecare element al listei este initiat de eticheta <li> ( list item ). Cele mai multe browsere afiseaza lista de directoare ca pe o lista neordonata.
(Nu se recomanda utilizarea acestori tipuri de liste).
Utilizari speciale ale listelor
Daca intr-o lista, in loc de elementele acesteia introduse prin <li>, se insereaza un bloc de text, aceasta va fi indentat ( intocmai ca elementele unei liste).
<html> <head><title>listex_9</title></head> <body><h1>Un bloc de text indentat</h1><hr> <ol> Un bloc de text indentat. Un bloc de
text indentat. Un bloc de text indentat. Un bloc de text indentat. Un bloc
de text indentat. Un bloc de text indentat. Un bloc de text indentat. Un bloc
de text indentat. Un bloc de text indentat.
</ol> </body> </html>
In exemplul urmator lista de definitii are itemii <dt> si <dd> multipli.
<html> <head><title>listex_10</title></head> <body><h1
align='center'>O lista de
definitii speciala</h1><hr> <dl>Program
<dt><b>Luni</b> <dt><b>Marti</b> <dt><b>Miercuri</b> <dd><i>Ora 9.00.</i>Insciere
<dd><i>Ora 11.00.</i>Audieri
<dd><i>Ora 13.30.</i>Raspunsuri
</dl> </body> </html>
Ultimul exemplu este o lista neordonata personalizata care utilizeaza pe post de elemente imagini si texte.
<html> <head><title>listex_11</title></head> <body><h1>O lista personalizata</h1><hr> <ul>Tipuri de masini Volkswagen sunt:<br> <img src='images/reddot.gif'>Golf<br> <img src='images/reddot.gif'>Jetta<br> <img src='images/reddot.gif'>Passat<br> <img src='images/reddot.gif'>Bora<br> <img src='images/reddot.gif'>Corrado<br> <img src='images/reddot.gif'>Transporter<br> </body> </html>
Politica de confidentialitate | Termeni si conditii de utilizare |
Vizualizari: 1386
Importanta:
Termeni si conditii de utilizare | Contact
© SCRIGROUP 2024 . All rights reserved