Tema 3 Liste in HTML

Liste în HTML
Tatiana Pașa
USM, Departamentul Informatică
Tema 3
Liste ordonate în HTML
HTML pune la dispoziție eticheta <ol>... </ol> <html>

(ordered list) pentru o listă ordonată fiecare <head>
element al listei este iniţiat de eticheta <li> (list item). <title>Lista ordonate</TITLE>
</head>
Lista va fi indentată faţă de restul paginii Web, <body>
fiecare element va începe pe o linie nouă și <ol>Firma vă oferă următoarele servicii:
<li>printare </li>
marcarea elementelor se face prin cifre. <li>laminare </li>
<li>îndosariere </li>
<li>xerox </li>
<li>tehnoredactare </li>
</ol>
</body>
</html>
Folosește atributele start, type și reversed pentru a realiza lista cea mai potrivită cerințelor.
Poți începe lista cu orice alt număr dorești In locul cifrelor arabe pot fi folosite cifre romane
specificându-l cu atributul start. sau litere iar în ambele cazuri pot fi folosite litere
mici sau majuscule. Se folosește atributul type
pentru a modifica tipul numerotării.
<OL start="4">Firma vă oferă
următoarele servicii: De exemplu:
<LI>printare </LI> <OL type="a">
<LI>laminare </LI> <OL type="A">
<LI>îndosariere </LI> <OL type="I">Firma vă oferă
<OL type="i">
<LI>xerox </LI> următoarele servicii:
<LI>tehnoredactare </LI> <OL type="I"> <LI>printare </LI>
</OL> <LI>laminare </LI>
<LI>îndosariere </LI>
<LI>xerox </LI>
<LI>tehnoredactare </LI>
</OL>
Pentru a afișa numerele listei în ordine inversă se

folosește atributul reversed.
<OL start="4" type="I">Firma vă
oferă următoarele servicii: <OL start="3" type="I" reversed> Firma vă
<LI>printare </LI> oferă următoarele servicii:
<LI>laminare </LI> <LI>printare </LI>
<LI>îndosariere </LI> <LI>laminare </LI>
<LI>xerox </LI> <LI>îndosariere </LI>
<LI>tehnoredactare </LI> <LI>xerox </LI>
</OL> <LI>tehnoredactare </LI>
</OL>
Liste neordonate în HTML
Eticheta: <ul>... </ul> (unsorted list) Se folosește atributul type pentru a realiza
permite crearea unei liste neordonate. lista cea mai potrivită cerințelor: pătrățele,
Valoarea standard redată de buline și cerculete.
<UL <ul type="square"> Firma
majoritatea browser-elor sunt bulinele. De exemplu: oferă serviciile:
<ul type="square"> <LI>printare </LI>
<UL>Firma oferă serviciile: <LI>laminare </LI>
<LI>printare </LI> <ul type="disc">
<LI>laminare </LI> <ul type="circle"> <LI>xerox </LI>
<LI>îndosariere </LI> <LI>tehnoredactare </LI>
<LI>xerox </LI> </UL>
<UL type="circle"> Firma oferă
serviciile:
</UL> <LI>printare </LI>
<LI>laminare </LI>
<LI>xerox </LI>
</UL>
Liste imbricate în HTML
În cadrul unei liste, fie ea ordonată sau neordonată, se pot include alte liste,
procedeu numit imbricare.
<H1 align="center">Liste imbricate</H1><HR>
<UL>
<LI>Bulina 1
<OL>
<LI>Numarul 1 </LI>
<LI>Numarul 2 </LI>
</OL> </LI>
<LI>Bulina 2 </LI>
<LI>Bulina 3 </LI>
<UL type="square">
<LI>Patrat 1 </LI>
<LI>Patrat 2 </LI>
<LI>Patrat 3 </LI>
</UL>
<LI>Bulina 4 </LI>
</UL>
Referințe HTML
<HTML>
<HEAD>
<TITLE>Lista</TITLE>
</HEAD>
<BODY>
<H1 align="center">Liste de legaturi</H1><HR>
<OL type="I">
<LI>Licenta
<OL>
<LI><A href="Luni.html">Luni</A> </LI>
<LI><A href="Marti.html">Marti</A> </LI>
<LI><A href="Miercuri.html">Miercuri</A> </LI>
</OL></LI>
<LI>Meniu
<OL>
<LI><A href="Mic_dejun.html">Micul dejun</A> </LI>
<LI><A href="Prinz.html">Prânz</A> </LI>
<LI><A href="Cina.html">Cina</A> </LI> </LI>
</OL></LI>
</OL>
</BODY>
</HTML>
Liste de definiții în HTML
Listele de definiții reprezintă un tip special de liste în care elementele listei nu sunt nici
numerotate (ca în listele ordonate), nici marcate prin buline (ca în listele neordonate) şi
care prezintă două nivele de indentare.
✓ Listele de definiţii sunt blocuri de text incluse între etichetele <dl>... </dl> (definition list),
eticheta de închidere fiind obligatorie. Această listă redă cuvântul deasupra definiției.
Este indicat să ingroșăm cuvântul pentru a fi mai bine evidențiat.
✓ Fiecare element al listei este introdus prin eticheta <dt> (definition term).
✓ Fiecare element introdus prin eticheta <dt> conţine la rândul său un număr de elemente
care îl definesc, introduse prin eticheta <dd> (definition description).
Etichetele <DL> şi </DL> marchează începutul şi sfârşitul listei, termenii care fac parte din listă sunt
introduşi prin eticheta <DT> iar definiţiile termenilor, prin etichetele <DD>.
<H1 align="center">Liste de definiţii</H1><HR>

<DL>
<DT>Iarna </DT>
<DD>Ninge </DD>
<DD>E frig </DD>
<DD>Ziua e mai scurtă decât noaptea </DD>
<DT>Primăvara </DT>
<DD>Natura se trezeşte la viaţă </DD>
<DD>Infloresc pomii </DD>
<DD>Se intorc păsările călătoare </DD>
<DT>Vara </DT>
<DD>Totul e verde </DD>
<DD>E foarte cald </DD>
<DD>Ziua e mai lungă decât noaptea </DD>
<DT>Toamna </DT>
<DD>Se coc fructele </DD>
<DD>Se strânge recolta </DD>
<DD>Cad frunzele </DD>
</DL>
<dl>
<dt><b>Profesor</b></dt>
<dd>persoană cu opregătire specială care predă un obiect
de învățământ într-un domeniu al științei, al artei etc..</dd>
<dt><b>Student</b></dt>
<dd>Cel care urmează cursurile unei facultăți sau ale unui
institur de învățământ superior..</dd>
</dl>

Tema 3 Liste in HTML

Încărcat de

Informații document

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

Tema 3 Liste in HTML

Încărcat de

Drepturi de autor:

Formate disponibile

Liste în HTML

HTML pune la dispoziție eticheta <ol>... </ol> <html>

Pentru a afișa numerele listei în ordine inversă se

<H1 align="center">Liste de definiţii</H1><HR>

S-ar putea să vă placă și