HTML
STURCTURA UNUI DOCUMENT HTML.
Tag-urile ajuta alaturi de texte browser-ul sa afiseze corect continutul paginii web. HTML este un limbaj de
marcare cu ajutorul caruia se creaza documente web. Tag-urile pot fi de doua feluri:
-Tag-uri pereche (unul de inceput si unul de incheiere);
Exemplu
<html> </html>; <title> </title>; <head> </head>; <body> </body>.
-Tag-uri singulare (care nu au tag de incheiere);
Exemplu
<hr>; <br>.
TAG-URI DE BAZA
Orice document HTML incepe cu tag-ul <html>-care ii spune browser-ului ca este vorba despre un document HTML
si se incheie cu tag-ul </html>.
Tag-urile <head> </head>-intre aceste tag-uri sunt trecute pe lânga titlul paginii diverse informatii
cum ar fi link-uri catre documente CSS externe folosite la stilizarea paginilor web; link-uri catre scripturi JAVASCRIPT
externe; tag-urile meta.
Tag-urile <title> </title> ii da un titlu documentului, textul scris intre aceste tag-uri va aparea
in bara de titlu a documentului.
Tag-urile <body> </body>-intre aceste tag-uri se va introduce continutul paginii web. Tot ce va fi scris
intre aceste tag-uri va fi afisat de catre browser pe ecranul monitorului. Tag-urile pot fi scrise atât cu litere
mari cât si cu litere mici.
Exemplu de document HTML.
<html>
<head>
<title> PRIMA PAGINA WEB </title>
</head>
<body>
Bine ai venit!<br>
Vom invata impreuna limbajul HTML.<br>
Aceasta pagina este prima mea pagina web.
</body>
</html>
Tag-ul <br> este tag-ul care sfârseste un rând si trece pe rândul urmator.
ATRIBUTELE HTML
Atributele pot fi definite ca niste proprietati ale tag-urilor. Atributele se pun numai in tag-urile de inceput; daca un tag
nu are atribut atunci browser-ul va lua in considerare valorile implicite ale tag-ului respectiv.
Exemplu de atribute:
-atributul BGCOLOR se foloseste cu tag-ul <body> si indica ce culoare va avea fondul
paginii web. Daca vrem spre exemplu ca fundalul paginii sa nu fie alb ci portocaliu vom folosi pentru atributul BGCOLOR
codul culorii orange #ff9900.
Exemplu:
<body bgcolor='ff9900'>
Daca vrem ca textul sa aiba alta culoare si sa fie scris cu litere mai mari decât restul textului vom folosi tag-ul
<font> insotit de atributele COLOR pentru a-i defini culoarea si SIZE
pentru marimea fontului.
Exemplu:
<font color='#0000ff' size='6'>
Bine ati venit!<br>
</font>
Atunci când dorim sa trasam o linie folosim tag-ul <hr> care vine de la 'horizontal rule' (linie orizontala).
Daca acestui tag nu-i vom asocia nici un atribut atunci vom obtine o linie cât latimea paginii web. Atributele acestui
tag sunt:
-ALIGN pentru alinierea liniei;
-COLOR pentru colorarea liniei;
-SIZE pentru grosimea liniei;
-WIDTH pentru lungimea liniei.
De exemplu pentru a trasa o linie rosie cu o lungime de jumatate din valoarea implicita si mai groasa decât ce implicita
ce va fi aliniata in centrul paginii vom scrie urmatoarea linie de cod:
<hr color='#ff0000' width='50%' size='5%' align='center'>
Iata un exemplu in care vom folosi cele explicate pâna in acest moment:
<html>
<head>
<title> Prima pagina web <title>
</head>
<body bgcolor='#ff9900'>
<font color='#0000ff' size='6'>
Bine ati venit!
</font><br>
<hr color='#ff0000' width='25%' size='7%' align='left'>
<br>
<font color='#ff0000'>
Aceasta este prima mea pagina web!</font> <br>
<hr>
</body>
</html>
TITLURI
Când avem nevoie sa folosim un titlu in cadrul paginii web putem apela la tag-urile <h1></h1>.....<h6></h6>.
Astfel in cadrul codului HTML vom folosi tag-ul <h1> de exemplu urmat de textul titlului iar la sfârsit vom folosi tag-ul de
incheiere </h1>. Tag-urile <h1></h1> permit scrierea cu caracterele cele mai mari iar <h6></h6> cu caracterele
cele mai mici. Aceste tag-uri suporta atributul ALIGN
FORMATAREA TEXTULUI
Pentru a alege caracteristicile unui text se poate folosi tag-ul <font>. Acet tag suporta mai multe atribute
(color, face, size) care ne vor ajuta la formatarea textului.
-Atributul COLOR se refera la culoarea fontului;
-Atributul FACE se refera la tipul fontului (ARIAL HELVETICA SANS-SERIF);
-Atributul SIZE se refera la marimea fontului (1,2,3,4,5,6,7) 1 pentru cea mai mica valoare si
7 pentru cea mai mare.
Exemplu
<font color='#ffa500' face='arial' size='7'>
textul ce va fi afisat
</font>
Daca vrem ca textul sa fie scris cu:
-caractere ingrosate vom folosi tag-urile <b></b>
-caractere inclinate (text italic) vom folosi tag-urile <i></i>
caractere subliniate vom folosi tag-urile <u></u>
Daca vrem ca textul sa fie afisat in centrul paginii vom folosi perechea de etichete <center></center>.
Tag-ul <p></p> vine de la cuvântul paragraf. Aceste tag-uri incadreaza un paragraf. Textul in interiorul
paragrafului este aliniat cu ajutorul atributului ALIGN.
<p align='left|center|right'></p>
IMAGINILE IN HTML
Cele mai raspândite formate sunt: .GIF; .JPEG; etc.Formatul .GIF poate reda un numar de 256 de culori si de
aceea este folosit pentru imagini de mici dimensiuni, butoane, icon-uri, animatii. Formatul .JPEG nu mai este limitat
la 256 de culori si de aceea este folosit pentru fotografii.
Pentru a folosi imaginile in cadrul unei pagini web trebuie folosit tag-ul <img> insotit de atributul SRC
(source) care indica adresa sau calea catre imaginea care vrei sa o folosesti. Forma generala a acestui tag este:
<img src='numele imaginii.extensie'>
Daca imaginea pe care vrem sa o adaugam in pagina noastra se afla in acelasi director cu pagina noastra vom folosi o expresie
asemanatoare cu cea de mai de sus dar daca imaginea se afla in alt director trebuie sa specificam si numele directorului
respectiv.
Exemplu
<img src='numele directorului/numele imaginii.extensie'>
Daca avem un site care va avea mai multe fisiere nu mai este o solutie sa le tinem pe toate in acelasi director; in
acest caz este bine sa grupam fisierele de acelasi tip in subfoldere.
Alte atribute ale tag-ului <img> sunt:
-atributul BORDER se foloseste pentru a incadra o imagine intr-un chenar. Acest atribut ia ca
valori numere intregi pozitive.
-atributul ALT. Daca imaginea este de dimensiuni mai mari atunci pâna se va incarca si va
fi afisata de catre browser in locul acesteia utilizatorul va putea vrdea un text.
-atributul ALIGN este folosit pentru a alinia imaginea in pagina si poate lua valorile
"left" sau "right", aliniere la stânga sau la dreapta paginii.
-atributele HSPACE si VSPACE sunt folosite ca textul care este afisat in jurul imaginii
sa fie afisat la o anumita distanta fata de imagine. HSPACE indica spatiul pe orizontala si VSPACE indica spatiul pe
verticala. Aceste atribute trebuie sa fie numere intregi care reprezinta distanta in pixeli dintre imagine si text.
Exemplu
<img src='numele directorului/nume poza.extensie' border='5' align='left' hspace='50' vspace='20'>
Imaginile se pot folosi ca fundal al paginilor web si acest lucru se face cu ajutorul atributului BACKGROUND
al tag-ului <body>.
<body background='nume director/nume poza.extensie'>
