[HTML] - Liste

[B09]

 

Acesta este al 5-lea tutorial din seria de aprofundare

[/font][/color]

 

 

 

[color=#a9a9a9][u][b][font=georgia,serif]Tutorial HTML - Liste[/font][/b][/u][/color]

[color=#ffffff][font=georgia,serif]HTML pune la dispozitie trei tipuri de liste. <ol> va afisa o lista ordonata in timp ce <ul> una neordonata, iar pentru a realiza o lista de defnitii se foloseste <dl>. Foloseste atributele type si start pentru a realiza lista cea mai potrivita cerintelor tale.[/font][/color]

 

[color=#000000][font=trebuchet ms', arial, sans-serif][size=3][background=rgb(255, 255, 255)]- <ul> - unsorted list, buline[/background][/size][/font][/color]

[color=#000000][font=trebuchet ms', arial, sans-serif][size=3][background=rgb(255, 255, 255)]- <ol> - ordered list, numere [/background][/size][/font][/color]

[color=#000000][font=trebuchet ms', arial, sans-serif][size=3][background=rgb(255, 255, 255)]- <dl> - definition list, lista de definitii.[/background][/size][/font][/color]

 

 

 

[u][b][color=#a9a9a9][font=georgia,serif]HTML - Lista ordonata[/font][/color][/b][/u]

[color=#ffffff][font=georgia,serif]Foloseste tag-ul <ol>pentru a incepe o lista ordonata. Prin punerea (list item) intre tagurile <ol> si </ol> semnalizezi browser-ului elementele listei.[/font][/color]

 

 

[size=3]<h4 align="center">Oviective</h4>[/size]

[size=3]<ol>[/size]

[size=3]<li>Sa fac 1.000 de posturi </li>[/size]

[size=3]<li>Sa iau Programmer </li>[/size]

[size=3]<li>Sa primesc 10 plusuri </li>[/size]

[size=3]</ol>[/size]

 

[b][color=#ffffff][font=georgia,serif]Vizualizare[/font][/color][/b]

 

 

 

 

 

[center][color=#ffffff][font=georgia,serif]Obiective[/font][/color][/center]

[color=#d3d3d3][font=georgia,serif]1. [font=arial,helvetica,sans-serif]Sa fac 1.000 de posturi[/font][/font][/color]

[font=arial,helvetica,sans-serif][color=#d3d3d3][b]2. Sa iau Programmer[/b][/color][/font]

[font=arial,helvetica,sans-serif][color=#d3d3d3][b]3. Sa primesc 10 plusuri[/b][/color][/font]

 

[i][color=#ffffff][font=georgia,serif]Poti incepe lista cu orice alt numar doresti specificandu-l insa cu ajutorul atributului start.[/font][/color][/i]

 

[size=3]<h4 align="center">Oviective</h4>[/size]

[size=3]<ol [color=#0000ff]start="4"[/color] >[/size]

[size=3]<li>[color=#D3D3D3][font=arial, helvetica, sans-serif]Sa fac 1.000 de posturi[/font][/color]</li>[/size]

[size=3]<li>Sa iau programmer</li>[/size]

[size=3]<li>Sa primesc 10 plusuri </li>[/size]

[size=3]</ol>[/size]

 

[color=#ffffff][b][font=georgia,serif]Vizualizare[/font][/b][/color]

 

[b] Oviective[/b]

 

[size=3] 4.Sa fac 1.000 de posutri

5. Sa iau Programmer

6. Sa primesc 10 plusuri[/size]

 

[color=#ffffff][i][font=georgia,serif]Acest element nu face nimic iesit din comun dar este destul de folositor uneori.[/font][/i][/color]

 

 

 

[u][color=#a9a9a9][b][font=georgia,serif]HTML - Alte tipuri de liste ordonate[/font][/b][/color][/u]

[color=#ffffff][font=georgia,serif]In afara de modelul mai sus aratat mai sunt alte patru tipuri de liste ordonate. In locul cifrelor arabe poti folosi cifre romane sau la fel de bine litere iar in ambele cazuri pot fi folosite litere mici sau majuscule. Foloseste atributul type pentru a modifica tipul numerotarii[/font][/color]

 

[size=3]<ol type="a">[/size]

[size=3]<ol type="A">[/size]

[size=3]<ol type="i">[/size]

[size=3]<ol type="I">[/size]

 

[color=#ffffff][b][font=georgia,serif]Vizualizare[/font][/b][/color]

 

[b]Litere mici[/b] [b]Majuscule[/b] [b]Numere romane cu litere mici[/b] [b]Numere romane cu majuscula[/b]

[size=3] a. Sa fac 1.000 de posturi.[/size]

 

[size=3] b. Sa iau Programmer[/size]

 

[size=3] c. Sa primesc 10 plusuri[/size]

 

[size=3] A. Sa fac 1.000 de posturi[/size]

 

[size=3] B. Sa iau Programmer[/size]

 

[size=3] C.Sa primesc 10 plusuri[/size]

 

[size=3] i. Sa fac 1.000 de posturi[/size]

 

[size=3] ii. Sa iau Programmer[/size]

 

[size=3] iii. Sa primesc 10 plusuri[/size]

[size=3] I. Sa fac 1.000 de posturi[/size]

 

[size=3] II. Sa iau Programmer[/size]

 

[size=3] III. Sa primesc 10 plusuri[/size]

 

 

[u][color=#a9a9a9][b][font=georgia,serif]HTML - Liste nesortate[/font][/b][/color][/u]

[color=#ffffff][font=georgia,serif]Creaza o lista nesortata cu ajutorul tagului <ul>. Listele nesortate deasemenea sunt de mai multe tipuri si anume, patratele buline si cerculete.Valoarea standard redata de majoritatea browser-elor sunt bulinele[/font][/color]

 

 

[size=3]<h4 align="center">lista de cumparaturi </h4>[/size]

[size=3]<ul> <li>lapte</li>[/size]

[size=3]<li>branza</li>[/size]

[size=3]<li>oua</li>[/size]

[size=3]<li>zahar</li>[/size]

[size=3]</ul>[/size]

[color=#ffffff][font=georgia,serif]Am alaturat ceva mai jos un exemplu despre cum arata si celelalte tipuri de liste neordonate.[/font][/color]

 

 

[size=3]<ul type="square">[/size]

[size=3]<ul type="disc">[/size]

[size=3]<ul type="circle">[/size]

 

 

[color=#a9a9a9][u][b][font=georgia,serif]HTML - Lista de definitii[/font][/b][/u][/color]

[color=#ffffff][font=georgia,serif]Deasemene poti face liste de definitii folosind tag-ul <dl>. Aceasta lista reda cuvantul deasupra definitiei. Este indicat sa ingrosam cuvantu pentru a fi mai bine evidentiat.[/font][/color]

 

[size=3]<dl>[/size]

[size=3]<dt><b>Fromage</b></dt>[/size]

[size=3]<dd>Cuvant francez pentru branza .</dd>[/size]

[size=3]<dt><b>Voiture</b></dt>[/size]

[size=3]<dd>Cuvant francez pentru masina</dd>[/size]

[size=3]</dl>[/size]

Edited August 27, 2013 by Christian UGD