In aceasta lectie vei invata cum poti folosi listele in pagina ta web. Listele pe care le poti crea cu ajutorul limbajului HTML sunt de urmatoarele tipuri: liste neordonate, liste ordonate si liste de definitii. Sa le luam pe rand.
Liste neordonate (UL)
Inainte de vorbi despre listele neordonate sa vedem, mai intai, cum arata una:
Firma noastra va ofera urmatoarele servicii:
printare
printare
indosariere
xerox
tehnoredactare
Pentru a putea face o lista neordonata trebuie sa folosim tag-urile <UL> si </UL> (denumirea acestor tag-uri vine de la "unordered list" care inseamna in limba engleza lista neordonata). Fiecare element al listei trebuie introdus de tag-ul <LI>. Ca sa intelegi mai bine sa vedem impreuna cum arata codul HTML pentru lista de mai sus:
Salveaza pagina cu numele de liste1.html in directorul Pagini. Pentru a vedea cum ar trebui sa arate aceasta pagina: click aici
Cu ajutorul atributului TYPE, putem schimba cercul plin din fata fiecarui element. Acesta este folosit in mod implicit atunci cand folosim o lista neordonata. Astfel, prin atribuirea unei valori atributului TYPE, vom putea face ca elementele listei sa fie precedate de un patrat sau de un cerc gol.
Pentru a vedea rezultatele, inlocuieste linia a 6-a din codul HTML de mai sus cu una din urmatoarele linii de cod:
pentru cercuri goale:
<UL TYPE=circle>Firma noastra va ofera urmatoarele servicii:
Salveaza pagina cu numele de liste2.html in directorul Pagini. Vezi rezultatul: click aici
pentru patrate pline:
<UL TYPE=square>Firma noastra va ofera urmatoarele servicii:
Salveaza pagina cu numele de liste3.html in directorul Pagini. Vezi rezultatul: click aici
Nu uita! Pentru a invata limbajul HTML trebuie sa scrii codul de la fiecare exemplu si sa vezi daca obtii aceleasi rezultate ca cele din cadrul cursului.
Liste ordonate (OL)
Am vazut cum putem folosi listele neordonate in cadrul paginilor web. Lista urmatoare pastreaza continutul celei de mai sus insa este o lista ordonata (ordered list). Sa vedem diferenta: Firma noastra va ofera urmatoarele servicii:
printare
printare
indosariere
xerox
tehnoredactare
Listele ordonate se formeaza cu ajutorul tag-urilor <OL> si </OL>, denumirea acestora venind din limba engleza "ordered list" care inseamna lista ordonata. La fel ca si la listele neordonate, fiecare element trebuie introdus de tag-ul <LI>.
Salveaza pagina cu numele de liste4.html in directorul Pagini. Pentru a vedea cum ar trebui sa arate aceasta pagina: click aici
Ca si in cazul listelor neordonate, si la listele ordonate, atributul TYPE are o valoare implicita, asa cum am vazut in exemplul de mai sus: numerele. In loc de numere putem folosi si alte caractere. Pentru a folosi aceste caractere este de ajuns sa utilizam atributul TYPE cu valoarea potrivita.
Pentru a vedea rezultatele, inlocuieste linia a 6-a din codul HTML de mai sus cu una din urmatoarele linii de cod:
pentru litere mari:
<OL TYPE=A>Firma noastra va ofera urmatoarele servicii:
Salveaza pagina cu numele de liste5.html in directorul Pagini. Vezi rezultatul: click aici
pentru litere mici:
<OL TYPE=a>Firma noastra va ofera urmatoarele servicii:
Salveaza pagina cu numele de liste6.html in directorul Pagini. Vezi rezultatul: click aici
pentru cifre romane mici:
<OL TYPE=i>Firma noastra va ofera urmatoarele servicii:
Salveaza pagina cu numele de liste7.html in directorul Pagini. Vezi rezultatul: click aici
pentru cifre romane mari:
<OL TYPE=I>Firma noastra va ofera urmatoarele servicii:
Salveaza pagina cu numele de liste8.html in directorul Pagini. Vezi rezultatul: click aici
Pe langa atributul TYPE, pentru tag-ul <OL> mai putem folosi si atributul START. Acest atribut este folosit atunci cand vrem sa schimbam valoarea initiala, de exemplu daca vrem sa incepem de la 4, in cazul numerelor, sau de la D, in cazul literelor mari, etc. Forma generala a acestui atribut este START=n, unde n este un numar natural. Sa vedem un exemplu:
<HTML>
<HEAD>
<TITLE>Liste ordonate</TITLE>
</HEAD>
<BODY>
<OL TYPE=A START=4>In vacanta de vara am vizitat urmatoarele orase: <LI>Roma <LI>Viena <LI>Londra <LI>Paris <LI>Praga </OL>
</BODY>
</HTML>
Codul de mai sus va afisa in cadrul browser-ului urmatoarea lista ordonata: click aici
Liste de definitii (DL)
Pentru a citi continuarea lectiei trebuie sa fii membru eCursuri.ro
Intra in contul tau sau inregistreaza-te GRATUIT (dreapta sus)
salut.am si eu o intrebare...cum fac sa am si eu ceva de genul http://www.probleme.ro sau orice altceva ca sa poata sa intre si alti ca mie imi apare asa:file://localhost/C:/Users/.....html oricum super tare cursul ;)
-4RaspundeAi votat deja acest comentariu!Multumim pentru votul tau!
Raspunde
Pentru a adauga comentarii trebuie sa fii membru eCursuri.ro
Intra in contul tau sau inregistreaza-te GRATUIT (dreapta sus)
@nemernic: Salut. Trebuie publicat undeva online (acum il ai fisierele respective doar pe calculatorul tau). Cel mai bine cauti pe net gazduire gratuita si prin intermediul unui admin vei putea sa publici paginile lucrate de tine.
-4Raspunde Ai votat deja acest comentariu!Multumim pentru votul tau!
Raspunde
Pentru a adauga comentarii trebuie sa fii membru eCursuri.ro
Intra in contul tau sau inregistreaza-te GRATUIT (dreapta sus)
Este un curs minunat, am ajuns pînă aici pas cu pas. Nici nu am ştiut că voi prinde atît de uşor limbajul HTML (la sigur .....pînă ce îl voi cunoaşte bine....va trebui să muncesc din greu).... mi-aţi aprins un foc în inimă să studiez acest compartiment - webdesigner - să nu fi dat de aşa explicaţii clare, nici nu ştiu dacă aş mai fi studiat aşa ceva.... Mulţumesc mult, tuturora care şi-au pus toată dragostea în explica cu atîta măiestrie cursul acesta.
-4RaspundeAi votat deja acest comentariu!Multumim pentru votul tau!
Raspunde
Pentru a adauga comentarii trebuie sa fii membru eCursuri.ro
Intra in contul tau sau inregistreaza-te GRATUIT (dreapta sus)
@hookjohny: Multumim si noi pentru cuvintele frumoase :) Ma bucur ca ti-a fost si iti este util acest curs. Asta a fost si scopul, sa ajute cat mai multi incepatori sa inteleaga limbajul HTML.
-4Raspunde Ai votat deja acest comentariu!Multumim pentru votul tau!
Raspunde
Pentru a adauga comentarii trebuie sa fii membru eCursuri.ro
Intra in contul tau sau inregistreaza-te GRATUIT (dreapta sus)
referitor la exercitiul 2; am ajuns la "barem de notare", am facut punctul 1 si cerintele le-am asezat una sub alta, dar nu imi apar patratelele pline.
multumesc
-1RaspundeAi votat deja acest comentariu!Multumim pentru votul tau!
Raspunde
Pentru a adauga comentarii trebuie sa fii membru eCursuri.ro
Intra in contul tau sau inregistreaza-te GRATUIT (dreapta sus)
Este foarte bun cursul ma ajuta enorm doar ca nu inteleg termeniiastai care se uzeaza aici , eu as dori sa imi explicatimai pe inteles cum fac cum creez saitul daca eu il am pe bucati salvat adica mai multe pagini html multumesc astept raspuns
1RaspundeAi votat deja acest comentariu!Multumim pentru votul tau!
Raspunde
Pentru a adauga comentarii trebuie sa fii membru eCursuri.ro
Intra in contul tau sau inregistreaza-te GRATUIT (dreapta sus)
Adauga comentariu
Pentru a adauga comentarii trebuie sa fii membru eCursuri.ro
Intra in contul tau sau inregistreaza-te GRATUIT (dreapta sus)
