CUPRINS

ARGUMENT................................................................................................Pag. 4

CAPITOLUL I

1.1. Noţiuni introductive .....................................................................Pag.5

1.2. Elemente de marcare ....................................................................Pag.7

1.3. Textul ............................................................................................Pag.9

1.4. Imagini ........................................................................................Pag.12

1.5. Tabele .........................................................................................Pag.14

1.6. Legaturi ......................................................................................Pag.17

CAPITOLUL II

1.1. Prezentare Delta Dunarii.............................................................Pag.21

1.2. Fisierele HTML...........................................................................Pag.22

1.3. Fisierul CSS.................................................................................Pag.23

BIBLIOGRAFIE.........................................................................................Pag. 25

3
4
 ARGUMENT

Atestatul meu reprezintă un site creat în limbajul HTML ce prezintă „Delta

Dunării”.

Am ales aceasta temă deoarece sunt pasionată de informatică şi am studiat la

ore paginilor Web. Mi s-a părut o oportunitate pentru a prezenta într-o formă modernă
înformaţii despre Delta Dunării.

În cadrul elaborării proiectului meu a trebuit să-mi extind aria de cunoştinţe

studiind bibliografia recomandată de dl. profesor întrumător, fapt ce îmi permite o
pregătire profesională mai bună, proiectul meu având aplicabilitate în studiul
microsistemulul Delta Dunării la diferite discipline sau pentru aprofundarea
cunoştintelor.

Tema aleasă este structurată în două capitole. Primul capitol prezintă succint
elementele de bază ale limbajul HTML pe când în capitolul al doilea sunt prezentate
componentele site-ului „Delta Dunării”.

Contribuţia personală privind elaborarea proiectului constă în selectarea

informaţiilor tehnice, practice şi teoretice specifice, structurarea pe capitole a acestora
şi realizarea practică a site-lui.

În elaborarea lucrării am folosit cunoştinţe tehnice/teoretice asimilate la diferite

module studiate în perioada cursurilor.

În partea finală a lucrării am specificat bibliografia utilizată.

5
 CAPITOLUL I

1.1. Notiuni introductive

Numit si reteua retelelor,Internetul isi are originea in ARPANET si in

NSFNET.Internetul este mai mult decit o suma de conecsiuni, desigur nimeni nu a
prevazut cum aceasta trecere de la o retea militara la una publica si comerciala ne va
afecta felul in care gindim despre informatie si comunicara.
Internetul are o structura,astfel incit daca vrei sa trimiti un E-mail la
calculatorul vecinului mesajul trebuie sa strabata sute de mile. Mai mult chiar,
masinile care sint conectate nu au fost construite sa comunice direct intre ele.
WWW-ul este serviciul Internet care s-a dezvoltat cel mai mult in ultimii ani si
care este si cel mai utilizat. WWW-ul este un sistem pentru accesul la hypertext pe
Internet .Este facut din documente,imagine,sunete si link-uri catre alte documente sau
servere . Limbajele folosite pentru construirea paginilor de internet sunt HTML-ul si
PHP-ul.
HTML este o formă de marcare orientată către prezentarea documentelor text
pe o singura pagină, utilizând un software de redare specializat, numit agent utilizator
HTML, cel mai bun exemplu de astfel de software fiind browserul web. HTML
furnizează mijloacele prin care conţinutul unui document poate fi adnotat cu diverse
tipuri de metadate şi indicaţii de redare. Indicaţiile de redare pot varia de la
decoraţiuni minore ale textului, cum ar fi specificarea faptului că un anumit cuvânt
trebuie subliniat sau că o imagine trebuie introdusă, până la scripturi sofisticate, hărţi
de imagini şi formulare. Metadatele pot include informaţii despre titlul şi autorul
documentului, informaţii structurale despre cum este împărţit documentul în diferite
segmente, paragrafe, liste, titluri etc. şi informaţii cruciale care permit ca documentul
să poată fi legat de alte documente pentru a forma astfel hiperlink-uri (sau web-ul).
HTML este un format text proiectat pentru a putea fi citit şi editat de oameni
utilizând un editor de text simplu. Totuşi scrierea şi modificarea paginilor în acest fel
solicită cunoştinţe solide de HTML şi este consumatoare de timp. Editoarele grafice
(de tip WYSIWYG) cum ar fi Macromedia Dreamweaver, Adobe GoLive sau
Microsoft FrontPage permit ca paginile web sa fie tratate asemănător cu documetele
Word, dar cu observaţia că aceste programe generează un cod HTML care este de
multe ori de proastă calitate.

6
 HTML se poate genera direct utilizând tehnologii de codare din partea
serverului cum ar fi PHP, JSP sau ASP. Multe aplicaţii ca sistemele de gestionare a
conţinutului, wiki-uri şi forumuri web generează pagini HTML.
HTML este de asemenea utilizat în email. Majoritatea aplicaţiilor de email
folosesc un editor HTML încorporat pentru compunerea email-urilor şi un motor de
prezentare a email-urilor de acest tip. Folosirea email-urilor HTML este un subiect
controversat şi multe liste de mail le blochează intenţionat.
Unul din primele elemente fundamentale ale WWW ( World Wide Web ) este
HTML ( Hypertext Markup Language ), care descrie formatul primar in care
documentele sint distribuite si vazute pe Web. Multe din trasaturile lui, cum ar fi
independenta fata de platforma, structurarea formatarii si legaturile hipertext, fac din
el un foarte bun format pentru documentele Internet si Web.
Primele specificatiile de baza ale Web-ului au fost HTML, HTTP si URL.
HTML a fost dezvoltat initial de Tim Berners-Lee la CERN in 1989. HTML a fost
vazut ca o posibilitate pentru fizicienii care utilizeaza computere diferite si schimbe
intre ei informatie utilizind Internetul. Erau prin urmare necesare citeva trasaturi :
independenta de platforma, posibilitati hypertext si structurarea
documentelor.Independenta de platforma inseamna ca un document poate fi afisat in
mod asemanator de computere diferite ( deci cu fonte, grafica si culori diferite ),
lucru vital pentru o audienta atit de variata.
Hipertext inseamna ca orice cuvint, fraza, imagine sau alt element al
documentului vazut de un utilizator ( client ) poate face referinta la un alt document,
ceea ce usureaza mult navigarea intre multiple documente sau chiar in interiorul unui
aceluiasi document. sStructurarea riguroasa a documentelor permite convertirea
acestora dintr-un format in altul precum si interogarea unor baze de date formate din
aceste documente.
Documentele HTML sint documente in format ASCII si prin urmare pot fi
create cu orice editor de texte. Au fost insa dezvoltate editoare specializate care
permit editarea intr-un fel de WYSIWYG desi nu se poate vorbi de WYSIWYG atita
vreme cit navigatoarele afiseaza acelasi document oarecum diferit, in functie de
platforma pe care ruleaza. Au fost de asemenea dezvoltate convertoare care permit
formatarea HTML a documentelor generate ( si formatate ) cu alte editoare. Evident
conversiile nu pot patra decit partial formatarile anterioare deoarece limbajul HTML
este inca incomplet.

7
 1.2. Elemente de marcare

Mai jos sunt tipurile de elemente de marcare în HTML:

Marcare structurală. Descrie scopul unui text. De exemplu:

<h1>Fotbal</h1>
Direcţioneaza browserul pentru a reda "Fotbal" ca pe cel mai important titlu.
Marcarea structurală nu are un anumit stil predefinit, dar cele mai multe browsere
web au standardizat modul în care acestea sunt afişate. De exemplu, titlurile
importante (h1, h2, etc.) sunt aldine şi mai mari decât restul textului.De notat că "h1"
este folosit doar o singură dată per pagină deoarece cu el este marcat titlul ei.

Marcare pentru prezentare. Descrie cum apare un text, indiferent de funcţiile sale.
De exemplu:
<b>îngroşat</b>
Va afişa textul "îngroşat" cu litere groase, aldine.Notă: Html a inceput în
ultimii ani să înceapă să nu mai folosească acest gen de tag-uri pentru că "b" nu dă
sens paginii, pe când tag-ul "strong" (adică strong emphasis) dă un înţeles paginii, şi
mai important, asemenea tag-uri pentru prezentare doar încarcă o pagină cu
informaţii şi o fac astfel mai greu de încărcat, iar apoi dacă ataşezi un document CSS
la pagină, o singură modificare la CSS (de ex: de la "font-weight:italic" la "font-
weight:bold" va schimba tot textul selectat, şi de exemplu, link-urile vor trece de la
text înclinat la text îngroşat, plus că în CSS avem avantajul de a putea preciza cât de
mari sau mici să fie literele în pixeli «px», în puncte «pt», etc.)avem acelaşi efect ca
şi cănd am avea de schimbat toate tag-urile de "i" de pe pagină în tag-uri de "b",
muncă care chiar şi la un website mic este enormă, ce să mai vorbim de unul de genul
wikipedia. Aşa că dacă vreţi să începeţi o carieră în html sau un hobby (şi să aveţi
succes) nu folosiţi aceste taguri, nu degeaba s-a inventat CSS-ul.

Marcare pentru hiperlink. Leagă părţi ale unui document cu alte documente. De
exemplu:
<a href="http://ro.wikipedia.org/">Wikipedia Românească</a>
8
 Va reda Wikipedia românească ca hiperlink către un URL specificat.
Elemente speciale (widget). Creează obiecte, cum ar fi butoanele şi listele.
Doar marcatorii de prezentare (împreună cu foile de stiluri - CSS) determină
cum conţinutul din interiorul marcatorului va fi prezentat. Ceilalţi marcatori spun
browserului ce obiecte să redea sau ce funcţii să execute.

Orice fişier html are următoarea structură

<html>
<head>
<title>Titlul</title>
</head>
<body>
</body>
</html>
Între tagurile <body></body> se scriu celelalte "instrucţiuni".
Tagul <body> permite stabilirea fundalului si a culorii hiperlinkurilor.
<body bgcolor="#ff0000"> - culoarea fundalului paginii devine rosie
<body background="fundal.jpg"> - pune o imagine în fundalul paginii
<body link="#ff0000" alink="#00ff00" vlink="#0000ff"> - stabileşte culoarea
linkurilor nevizitate şi vizitate.
Titlul unei pagini se obtine inserand in sectiunea <head>...</head> a
urmatoarei linii:
<title>Aceasta este o pagina de Web</title>
In plus, in sectiunea <body>...</body> putem scrie texte cat dorim. Daca nu
intalnim nici un marcaj “<” sau ” >” atunci interpretorul HTML le va lua ca texte
simple si le va afisa pe ecran. Sa vedem o noua versiune a paginii noastre:
<html>
<head>
<title>Aceasta este pagina de Web</title>
9
 </head>
<body>
Bine ati venit in pagina de Web!
</body>
</html>

Continutul blocului <title>...</title> va aparea in bara de titlu a ferestrei

browser-ului. Daca acest bloc lipseste intr-o pagina HTML, atunci in bara de titlu a
ferstrei browser-ului va aparea numele fisierului.
Daca introducem mai multe linii intr-o pagina browser-ul va afisa intr-un
singur rand, intrucat caracterele “ CR/LF “ sunt ignorate de browser. Trecerea pe o
linie noua se face la o comanda explicita, care trebuie sa apara in pagina html.
Aceasta comanda este marcajul <br> ( de la “ line break “ – intrerupere de linie ).

1.3. Textul

Cel mai important element al unei pagini internet este, desigur, textul. Intr-o
forma simpla, acesta poate fi scris efectiv intr-o pagina HTM.
Doua lucruri trebuie mentionate in primul rand, legate de formatarea textelor:
utilizarea spatiilor si trecerea la un nou rand. Intr-un fisier HTML afisarea mai multor
spatii consecutive nu este posibila prin scrierea directa in fisierul html ci folosind de
mai multe ori sintagma &nbsp;. Astfel, pentru a pune trei spatii intre cuvintele ABC
si SRL in textul "ABC SRL" va trebui sa scriem in fisierul HTML astfel:

ABC&nbsp;&nbsp;&nbsp;SRL

Trecerea la un nou rand nu se face apasand Enter in fisierul HTML, ci utilizand

tag-ul <BR> (acest tag se utilizeaza singur; nu se foloseste cu </BR>).Astfel, pentru a
scrie "ABC" pe un rand, a lasa un rand liber, si "SRL" pe un rand separat, vom folosi:

10
 ABC<BR><BR>SRL

Am utilizat mai sus de doua ori tag-ul BR: o data pentru a trece la un nou rand
si o data pentru a lasa un rand liber. Tag-ul utilizat pentru formatarea modului de
afisare a textului este <FONT>...</FONT>. Tag-ul FONT suporta mai multi
parametri, printre care:
- SIZE=x, unde x este dimensiunea fontului (1 fiind dimensiunea cea mai mica);
- COLOR=#RRGGBB - culoarea cu care se va afisa fontul (vom reveni asupra
acesteia in capitolul urmator).Culoarea implicita este negru;
- FACE=font - fontul cu care va fi scris textul respectiv. Atentie! Vizitatorii paginii
tale trebuie sa aiba fontul respectiv instalat pe calculator, deci utilizeaza numai
fonturi "clasice". Fontul implicit este Times New Roman
Acesti parametri poti fi utilizati separat sau simultan in cadrul tag-ului FONT.
Astfel, instructiunea de mai jos afiseaza text folosind culoarea albastru:

<FONT COLOR=#0000AA>ABC SRL - Lider pe piata serviciilor</FONT>

Instructiunea de mai jos afiseaza acelasi text cu font arial, culoare albastra si
dimensiune mai mare:

<FONT COLOR=#0000AA SIZE=4 FONT=ARIAL >ABC SRL - Lider pe piata

serviciilor</FONT>

Dupa cum se poate vedea, se pot utiliza mai multi parametri in cadrul aceluiasi
tag FONT. Acestia nu se despart prin virgula, ci printr-un spatiu.De retinut ca
parametrul FACE poate primi mai multe fonturi.
Astfel, un tag de tipul <FONT FACE=VERDANA,ARIAL>...</FONT> va
instrui browserul sa utilizeze fontul Verdana, iar daca acesta nu este gasit, sa utilizeze
Arial.

11
 Mai exista trei tag-uri utile pentru formatarea textelor: <B>...</B> - utilizat
pentru scrierea textelor cu bold, <I>...</I> - utilizat pentru scrierea textelor cu italics
(litere inclinate) si <U>...</U> - pentru a scrie text subliniat.
Desigur, pot exista combinatii intre tag-ul FONT si tag-urile de subliniare, ingrosare
sau inclinare, ca de exemplu:
<FONT COLOR=#00AA00><B>Text verde ingrosat</B></FONT>

Acest lucru se face prin intermediul atributului text al etichetei <body> dupa
sintaxa <body text=culoare>. In urmatorul exemplu textul are culorea rosie.
<html>
<head>
<title>culoare textului </title>
</head>
<body text=red>
Un text de culoare rosie.
</body>
</html>
O eticheta poate avea mai multe atribute.De exemplu , o eticheta cu trei
atribute arata astfel: <eticheta atribut1 = valoare1 atribut2 = valoare2 atribut3 =
valoare3>. Urmatorul exemplu prezinta o pagina cu fondul de culoare albastra si
textul de culoare galbena.
<html>
<head>
<title>atribute multiple </title>
</head>
<body bgcolor=blue text=yellow>
Fond de culoare albastra si text de culoare galbena.
</body>
</html>

12
 Textul afisat este caracterizat de urmatoarele atribute: Marime (size), Culoare
(color), Font (style).

1.4. Imagini

Imaginile sunt stocate in fisiere cu diverse formate. Formatele acceptat de

browsere pentru fisierele imagine sunt:
- GIF (Graphics Interchange Format) cu extensia .gif;
- JPEG (Joint Photographic Experts Group) cu extensia .jpeg sau .jpg;
- XPM (X PixMap) cu extensia .xmp;
- XBM (X BitMap) cu extensia .xbm;
- BMP (BitMap) cu extensia .bmp (numai cu Internet Explorer);
- TIFF (Tagged Image File Format) cu extensia .tif sau .tiff;
Cele mai raspandite formate sunt GIF(8biti pentru o culoare, 256 culori
posibile) si JPEG (24biti pentru o culoare, 16777216 de culori posibile).
Pentru a insera o imagine intr-o pagina, se utilizeaza eticheta <img> (de la
“image”=imagine).
Pentru a putea fi identifica imaginea care va fi inserata, se utilizeaza un atribut
al etichetei <img> si anume src (de la “source”=sursa). Daca imaginea se afla in
acelasi director cu fisierul HTML care face referire la imagine, atunci adresa URL a
imaginii este formata numai din numele imaginii, inclusiv extensia.
<img src=”w3.gif”>
Daca doriti sa adaugati un chenar in jurul imaginii, folositi atributul border al
etichetei <img>.
Valorile acestor atribute sunt numere intregi pozitive.
O imagine are anumite dimensiuni pe orizontala si verticala, stabilite in
momentul crearii ei. Daca nu se cere altfel , aceste dimensiuni sunt respectate in
momentul afisarii ei in pagina Web.
Dimensiuniile prestabilite ale unei imagini pot fi modificate prin intermediul
atributelor width si height.
13
 Alinierea unei imagini se poate face prin intermediul atributului align care poate
lua urmatorele valori:
- “ left “ – aliniere la stanga; celelalte componente sunt dispuse pe in partea
dreapta;
- “ right “ – aliniere la dreapta; celelalte componente sunt dispuse pe in partea
stanga;
- “ top “ – aliniere deasupra; partea de sus a imaginii se aliniaza cu partea de sus
a textului ce precede imaginea;
- “ middle “ – aliniere la mijloc; mijlocul imaginii se aliniaza cu linia de baza a
textului ce precede imaginea.
- “ bottom “ – aliniere la baza; partea de jos a imaginii se aliniaza cu linia de
baza a textului.
<img src=”w3.gif” align=”center”>

Atributele hspace si vspace precizeaza distanta in pixeli pe orizontala ,

respectiv pe verticala, dintre imagine si restul elementelor din pagina.
Atributul alt admite ca valoare un text care va fi afisat in locul imaginii.
<img src=”w3.gif” align=”left” hspace=”30” vspace=”30” alt=”text”>
O imagine poate fi utilizata pentru a stabili fondul unei pagini Web. In acest
scop se foloseste atributul background al etichetei <body>, avand ca valoare adresa
URL a imaginii.
Imaginea se multiplica pe orizontala si pe verticala pana umple intregul ecran.
<body background=”w3.gif”>
O legatura (link) introduce in pagina Web o zona activa.
Efectuand click cu butonul mouse-ului pe aceasta zona in browser se va incarca o alta
pagina. Pentru a utiliza imaginea “ubm1.jpg” drept legatura catre pagina index.html
utilizam sintaxa:
<a href =”index-2.html”><img src= “w3.gif”></a>
In mod prestabilit imaginea utilizata pe post de zona activa este inconjurata de
un chenar avand culoarea unei legaturi.

14
 1.5.Tabele

Tabelele ne permit sa cream o retea dreptunghiulara de domenii, fiecare

domeniu avand propriile optiuni pentru culoarea fondului, culoarea textului, alinierea
textului etc.
Pentru a insera un tabel se folosesc etichetele corespondente <table>...</table>.
Un tabel este format din randuri. Pentru a insera un rand intr-un tabel se folosesc
etichetele <tr>...</tr> ( de la „ table row „= rand de tabel ).Folosirea etichetei de
sfarsit </tr> este optionala.
Un rand este format din mai multe celule ce contin date.
O celula de date se introduce cu eticheta <td>..</td>.
<html>
<head><title>tabelex_1</title></head>
<body><h1 align=center>Un tabel simplu format din 4 linii si 2 coloane</h1><hr>
<table>
<tr> <td>cell 11</td> <td>cell 11</td></tr>
<tr> <td>cell 21</td> <td>cell 22</td></tr>
<tr> <td>cell 31</td> <td>cell 32</td></tr>
<tr> <td>cell 41</td> <td>cell 42</td></tr>
</table>
</body>
</html>
Cell 11 Cell 11
Cell 21 Cell 22
Cell 31 Cell 32
Cell 41 Cell 42

Daca atributul border nu este urmat de o valoare atunci tabelul va avea o

grosime prestabilita egala cu 1 pixel, o valoare egala cu 0 a grosimii semnifica
absenta chenarului.
15
 Pentru a alinia un tabel intr-o pagina Web se utilizeaza atributul align al
etichetei <table>, cu urmatoarele valori posibile: „ left „ ( valoarea prestabilita ),
„ center „ si „right „.
Alinierea este importanta pentru textul ce inconjoara tabelul. Astfel :
• daca tabelul este aliniat stanga ( <table align=”left”> ), atunci textul care
urmeaza dupa punctul de inserare al tabelului va fi dispus in partea dreapta a
tabelului.
• daca tabelul este aliniat dreapta ( <table align=”right”> ), atunci textul care
urmeaza dupa punctul de inserare al tabelului va fi dispus in partea stanga a tabelului.
• daca tabelul este aliniat pe centru ( <table align=”center”> ), atunci textul care
urmeaza dupa punctul de inserare al tabelului va fi afisat pe toata latimea paginii,
imediat sub tabel.
Distanta dintre tabel si celelalte elemente din pagina Web poate fi stabilita cu
ajutorul atributelor hspace si vspace al etichetei <table>. Valoarea atributului hspace
poate fi orice numar pozitiv, inclusiv 0, si reprezinta distanta pe orizontala dintre
tabel si celelalte elemente ale paginii Web.
Valoarea atributului vspace poate fi orice numar pozitiv, inclusiv 0, si
reprezinta distanta pe verticala dintre tabel si celelalte elemente ale paginii Web.
Culoarea de fond se stabileste cu ajutorul atributului bgcolor, care poate fi
atasat intregului tabel prin eticheta <table>, unei linii prin eticheta <tr> sau celule de
date prin eticheta <td>.
Daca in tabel sunt definite mai multe atribute bgcolor, atunci prioritatea este
urmatoarea: <td>, <tr>, <table> ( cu prioritate cea mai mica ).
Culoarea textului din fiecare celula se pote stabili cu ajutorul expresiei:
<font color=”valoare”>...</font>.
Distanta dintre doua celule vecine se defineste cu ajutorul atributului
cellspacing al etichetei <table>.Valorile acestui atribut pot fi numere intregi pozitive,
inclusiv 0, si reprezinta distanta in pixeli dintre doua celule vecine.
Valorea prestabilita a atributului cellspacing este 2.
Distanta dintre marginea unei celule si continutul ei poate fi definita cu ajutorul
atributului cellpadding al etichetei <table>.Valorile acestui atribut pot fi numere
intregi pozitive, si reprezinta distanta in pixeli dintre celule si continutul ei.
16
Valorea prestabilita a atributului cellpadding este 1.
<html>
<head><title>tabelex_6</title></head>
<body><h1 align=center>Un tabel de celule mari</h1><hr>
<table border=”0” cellpadding=”20”>
<tr> <td>gri 11</td> <td>rosu 12</td></tr>
<tr> <td>albastru 21</td> <td>galben 22</td></tr>
</table>
</body>
</html>
Alinierea pe orizontala a continutului unei celule se face cu ajutorul atributului
align care poate lua valorile:
• „ left „ ( la stanga );
• „ center „ ( centrat , valoarea prestabilita );
• „ right „ ( la dreapta );
• „ char „ ( alinierea se face fata de un caracter ).
Alinierea pe verticala a continutului unei celule se face cu ajutorul atributului
valign care poate lua valorile:
• „ baseline „ ( la baza );
• „ bottom „ ( jos );
• „ middle „ ( la mijloc, valoarea prestabilita );
• „ top „ ( sus ).
Aceste atribute pot fi atasate atat etichetei <tr> pentru a defini tuturor
elementelor celulelor unui rand, cat si etichetelor <td> si <th> pentru a stabili
alinierea textului intr-o singura celula.

1.6.Legaturi

17
 Un element important al oricarei pagini web il constituie link-urile catre alte
pagini. Acestea pot fi link-uri externe, care fac referire catre un alt site, sau link-uri
interne care fac referire catre alte pagini ale aceluiasi site. Ambele tipuri se codifica
asemanator prin folosirea unui tag de tipul <A HREF=link.html>...</A> (pentru un
link intern) sau
<A HREF=http://www.abc.abc>...</A> pentru un link extern. Astfel codul de mai jos
va afisa textul "Apasati aici pentru pagina 2" care prin apasare va incarca fisierul
pag2.html:

<A HREF=pag2.html>Apasati aici pentru pagina 2</A>

Codul de mai jos va afisa "Apasati aici pentru pagina XYZ SRL", text care prin
apasare va incarca pagina www.xyz.xyz:

<A HREF=http://www.xyz/xyz>Apasati aici pentru pagina XYZ SRL</A>

In exemplul de mai sus poti specifica in ce mod se va incarca pagina respectiva

folosind atributul TARGET:
- TARGET="nume", unde nume este numele pe care vrei sa il dai unei noi ferestre
unde se va incarca pagina. Poti folosi si TARGET="_blank" pentru o fereastra noua
sau TARGET="_self" pentru incarcarea in aceeasi fereastra.

O alta varianta este posiblitatea transmiterii unui e-mail. Astfel, codul de mai
jos afiseaza "Scrie-ne!", text care prin apasare va deschide o fereastra pentru
transmiterea unui mesaj la adresa office@abc.abc:

<A HREF="mailto:office@abc.abc">Scrie-ne!</A>

In acelasi mod o pagina HTML poate fi impartita in mai multe "capitole"

(sectiuni), in caz ca este foarte lunga. Astfel, fiecarei sectiuni i se va asigna un nume,
nume ce va putea fi utilizat in incarcarea paginii respecitve, astfel incat sa se afiseze
18
exact sectiunea respectiva. Fie fisierul lucrare.html pe care il impartim in doua
sectiuni.Codul care face acest lucru ar fi:

<A NAME=unu>Sectiunea 1</A>

...text pentru sectiunea 1...
<A NAME=doi>Sectiunea 2</A>
...text pentru sectiunea 2...

Apoi, daca dorim sa incarcam fisierul lucrare.html din alta pagina, dar astfel
incat sa se incarce direct sectiunea 2, vom utiliza:

<A HREF=lucrare.html#doi>Apasa aici</A>

In mod similar poti afisa fisiere text (cu extensia txt) sau poti da posibilitatea
vizitatorului sa salveze pe disc un alt tip de fisier (zip de exemplu):

<A HREF=raport.txt>Raport</A> sau <A HREF=program.zip>Salveaza

programul</A>
Un alt element util in formatarea paginii web este tag-ul <CENTER
>...</CENTER>. Acesta este utilizat pentru alinierea pe centru a unor elemente
(texte, tabele imagini). Tot ce este scris intre tag-ul <CENTER> si </CENTER> va
apare centrat.
In mod prestabilit se utilizeaza trei culori pentru legaturi:
- o culoare pentru legaturile nevizitate (nu s-a efectuat nici un clic pe ele)
- o culoare pentru legaturile vizitate (s-a efectuat cel putin un clic pe ele)
- o culoare pentru legaturile active (deasupra carora se afla mouse-ul la un
moment dat).
Aceste atribute pot fi stabilite cu ajutorul a trei atribute ale etichetei <body>:
- link pentru legaturile nevizitate;
- vlink pentru legaturile vizitate;

19
 - alink pentru legaturile active.
Valorile pe care le pot lua aceste atribute sunt culori definite prin nume sau
conform standardului RGB.
<html>
<head>
<title> Culori pentru lagaturi</title>
</head>
<body link=”blue” vlink=”green” alink=”red”>
<h3>Setarea culorilor pentru link-uri:<br>rosu pentru legaturi active, verde pentru
legaturi vizitate si albastru pentru legaturi nevizitate </h3>
<a href=leg_ex1.html>
Link catre pagina 1 <br>
<a href=leg_ex2.html>
Link catre pagina 2 <br>
<a href=leg_ex8.html>
Link catre pagina 11 </a>
</body>
</html>

Atributul title apartine etichetei <a> si comanda aparitia unei mici ferestre in
pagina Web cand mouse-ul se afla pe o legatura, fereastra in care este afisata valoarea
data acestui atribut.
Acest atribut are astfel menirea de a furniza informatii suplimentare despre
semnificatia unei legaturi.
<html>
<head>
<title> Atributul title</title>
</head>
<body>
20
<h3>Atributul title</h3><br>
<a href=”mailto:a_bsz@yahoo.com” title=”adresa mea de e-mail”>
Mesaje catre autorul paginii
</body>
</html>
Legaturi catre fisiere de sunet
Sunetele pot fi stocate in fisiere in diverse formate:
- AU/m-law cu extensia .au;
- AIFF/AIFC cu extensiile .aiff, .aif;
- WAVE/WAV cu extensia .wav;
- MPEG Audio cu extensia .mpeg2, sau .mp2;
- MIDI cu extensia .mid sau .midi;
O legatura catre un fisier de sunet se realizeaza folosind eticheta <a> destinata
legaturilor catre orice tip de fisiere, unde atributul href va avea valoarea egala cu
adresa URL a fisierului de sunet.
De exemplu:
<a href=”numefisier.au”>Link catre fisierul de sunet</a>

21
 CAPITOLUL II

1.1.Prezentare Delta Dunarii

Delta Dunării, aflată în mare parte în Dobrogea, România, şi parţial în

Ucraina, este cea mai mare şi cea mai bine conservată dintre deltele europene.
Folosind limbajul HTML si CSS se va realiza un site despre Delta Dunarii. Acesta va
contine link-uri in partea stanga spre celelalte pagini ale situ-lui. Paginile se vor
deschide intr-un iframe.

Acest site are rolul de as transmite informatii generale despre Delta Dunarii, de
a prezenta peisajele, fenomenele ce influenteaza delca, precum fauna, flora, clima.

Pagina principala, se numeste index.html. Aceasta pagina are o culoare de

fundal pusa in tag-ul body cu atributul bgcolor="#1a8dbc", este o nuanta mai
deschisa de albastru.

Pagina este structurata pe mai multe tabele, unul principal in care se afla
celelalte.

22
 Imaginea verde de sus este pusa in tabelul principal ca background.
Link-urile sunt formate cu ajutorul unui alt tabel, acesta are imagini de fundal
pe fiecare linie. Acestea isi schimba culoare atunci cand mousul este deasupra lor.

In centrul paginii se deschid celelalte pagini, intr-un ”iframe”, acesta a fost

implementat astfel:

<iframe width="610" src="file/home.html" height="900" name="frame"></iframe>

1.2 Paginile HTML

Paginile ce compun site-ul se deschid in iframe-ul tabelului principal.

Fiecare pagina are in partea de sus, aliniat la centru, la centru un titlu ce are

„class=”titlu””, de culoare alba. Sub acesta se afla o imagine ce prezinta un peisaj

referitor la titlul paginii deschise in iframe.

23
 1.3. Fisierul CSS

CSS este un acronim provenind din Cascading Style Sheets, care înseamnã "foi
de stil în cascadã". In documentele W3C, CSS nu e definit ca un nou limbaj, ci ca un
mecanism care permite formatarea documentului HTML.

CSS-ul nu exclude HTML-ul din pagina web. Nu se poate realiza o paginã web
folosind numai CSS, care a fost proiectat astfel încât sã conlucreze cu HTML-ul.
Proiectantii CSS-ului au urmãrit îndeosebi separarea între:

 continutul paginii ( textul destinat vizitatorului si imaginile din

paginã)
 codul-sursã
Folosind CSS, se ajunge la:
 un control mai fin asupra paginii web
 scãderea dimensiunii în octeti a paginii web, atunci când codul CSS e
continut într-un fisier extern
 o mai mare comoditate: modificând fisierul CSS extern, modificãm
simultan toate paginile web în care acesta e inclus
 efecte mai sofisticate decât cele produse de codul HTML:
suprapunerea unei imagini peste altã imagine, a unui text peste alt
text, impresia de relief, efectul hover, afisarea unor fonturi mai mari
decât h1 etc.
Contine toate font-urile si formatele textului folosit in intreg situ:
.titlu { font-family:Georgia, "Times New Roman", Times, serif;
font-size:24px;
font-weight:bolder;
color:#006600;
24
 font-style:oblique;
}
.text {font-family:"Times New Roman", Times, serif;
color:#000000;
font-size:14px;
font-weight:bold;
font-stretch:ultra-expanded;
}

a.link:link {font-family: Tahoma; font-size: 14px; color:#FFFFFF;

text-decoration: none; font-weight: bolder;}
a.link:visited {font-family: Tahoma;font-size: 14px;color:#FFFFFF;text-
decoration: none;font-weight: bolder;}
a.link:hover {font-family: Tahoma;font-size: 14px;color:#000000; text-
decoration: underline;font-weight: bolder;}
a.link:active {font-family: Tahoma;font-size: 14px;color:#FFFFFF;text-
decoration: none;font-weight: bolder;}

25
 BIBLIOGRAFIE

Au fost utilizate pentru documentare urmatoarele site-uri:

www.lokeshdhakar.com
ro.wikipedia.org
www.w3schools.com
www.google.ro

26