Sunteți pe pagina 1din 4

HTML

Un document HTML contine text si marcaje. Textul contine informatia ce va fi afisata in pagina Web. Un marcaj (tag) este cuprins intre caracterele ,,< si ,,>. Exemple de marcaje: <html>, </html> (elemental ,,/ este un marcaj final) Formatul unui document HTML are urmatoarea forma: <html> <head> <title> TITLUL PAGINII </title> </head> <body> ELEMENTE CARE APAR IN PAGINA </body> </html> Acest cod se scrie in editorul de texte NOTEPAD, se salveaza cu SAVE, se scrie numele fisierului sub forma nume_fisier.html sau nume_fisier.htm. Pentru a vizualiza pagina creata se deschide browserul Internet Explorer, se allege din meniul FILE OPEN, se cauta cu Browse fisierul salvat in Notepad si se deschide. Fara a fi obligatoriu, se considera correct ca fiecarui document HTML sa I se adauge un titlu. Acest lucru se realizeaza cu ajutorul marcajului (tagului) <title> </title> inserat in blocul <head> </head>. Titlul va para in bara de titlu a ferestrei browserului. Informatia ce va fi afisata in pagina web este cea din interiorul blocului <body> </body>. 1. Stabilirea culorilor in pagina Web Culoarea de fond a paginii se precizeaza prin atributul bgcolor, iar culoarea textului prin intermediul atributului text. Ambele sunt attribute ale marcajului <body> si se introduce prin sintaxa: <body bgcolor=culoare text=culoare> Ex: <body bgcolor=yellow text=blue> (pagina va avea culoare galbena, textul culoare albastra) <html> <head> <title> Pagina color </title> </head> <body bgcolor=culoare text=culoare> Textul acestei pagini este albastru iar fondul este galben. </body> </html>

2. Trecerea informatiei pe un rand nou Fie exemplul urmator: <html> <head> <title> TITLUL PAGINII </title> </head> <body> Prima linie. A doua linie. A treia linie. </body> </html> Desi in codul de mai sus textul este dispus pe trei linii, afisarea in browser va fi pe o singura linie.Pentru ca in browser sa se respecte trecerea pe rand nou se foloseste marcajul <br> (break line). Acest marcaj este un marcaj nepereche (nu trebuie inchis cu ,,/). <html> <head> <title> TITLUL PAGINII </title> </head> <body> Prima linie. <br> A doua linie. <br> A treia linie. </body> </html> 3. Setarea marginilor paginii Web Pentru a pozitiona continutul paginii in raport cu marginile ferestrei browserului se folosesc atributele leftmargin si topmargin ale elementului <body>. Exemplu: <body leftmargin=80 topmargin=40%> 4. Titluri in pagina Web si alinierea lor Pentru a introduce in text un titlu sau un subtitlu de capitol (sunt posibile 6 niveluri), se folosesc marcajele pereche: <h1></h1>, <h2></h2>, <h3></h3>, <h4></h4>, <h5></h5>, <h6></h6>. Inaltime si grosimea caracterelor titlului sunt maxime pentru marcajul <h1></h1> si minime pentru <h6></h6>. Titlurile sunt aliniate in mod implicit la stanga. Alinierea titlurilor se poate schimba prin atributul align, cu valorile ,,left, ,,right, ,,center, prin sintaxa: <h1 align=valoare>

De exemplu: <h1 align=right> 5. Definirea paragrafelor Un paragraf este introdus prin marcajul <p>. O caracteristica a acestui marcaj este introducerea implicita a unui rand liber inainte de paragraf. Acest marcaj este de tip pereche, el trebuie inchis: <p>Acesta este un paragraph</p> Daca dorim ca paragraful sa fie aliniat la centru sau dreapta: <p align=right>paragraph aliniat la dreapta</p> 6. Inserarea unor linii orizontale de diverse marimi si dimensiuni Pentru inserarea acestor tipuri de linii se foloseste marcajul <hr>, de tip nepereche. Aspectul liniei (aliniere, lungime, grosime, culoare) se vor stabili prin urmatoarele atribute: align pt aliniere; poate avea valorile left, center, right; exemplu: <hr align=center> - introduce o linie pe centrul paginii width stabileste lungimea liniei <hr width=60%> size stabileste grosimea liniei <hr size=5> color defineste culoarea liniei <hr color=red> 6. Elementul center Acest element, introdus de marcajele <center> si </center> aliniaza la centru toate elementele dintre cele 2 marcaje. 7. Stabilirea fontului pt text Se realizeaza cu ajutorul elementului font, introdus prin marcajul <font>, de tip pereche. Caracteristicile fontului se stabilesc prin atributele color, face si size. a. atributul color defineste culoarea fontului <font color=red> b. atributul face stabileste tipul sau stilul fontului <font face=Arial> c. atributul size defineste marimea fontului <font size=3> Exemplu: <font face=TimesRoman color=red size=3>Informatie</font> -pe pagina web va apare cuvantul Informatie de marime 3, scris cu fontul TimesRoman, culoare rosie 8. Caractere evidentiate <b></b> - textul dintre marcajele <b> si </b> va apare ingrosat(caractere aldine) <i></i> - textul dintre marcajele <i> si </i> va apare cu caractere inclinate <s></s> - caractere taiate cu o linie orizontala

<strong></strong> - caractere puternic evidentiate <u></u> - caractere subliniate 9. Crearea hiperlegaturilor Pentru a naviga de la o pagina la alta sau pentru a efectua salturi controlate in cadrul aceleiasi pagini web se folosesc hiperlegaturile. Constructia unei hiperlegaturi se realizeaza prin intermediul elementului a (anchor) care apartine sectiunii body a documentului HTML. Ancora este definite intre marcajele <a> si </a>. Atributele cele mai importante ale elementului a sunt href si id sau name. - atributul href defineste destinatia hiperlegaturii - atributele id sau name elementului a i se asociaza un nume prin care poate fi folosit si el ca destinatie a unei hiperlegaturi Legaturi externe: - catre o alta pagina html: <a href=pagina2.html>Legatura</a> - cuvantul Legatura va face trecerea catre pagina2.html - legatura catre un alt site: <a href=http://www.netscape.com>Legatura</a> - cuvantul Legatura va face trecerea catre site-ul www.netscape.com - legatura ce determina lansarea in executie a unei aplicatii de posta electronica: <a href=mailto:marin_pop@gmail.com>adresa mail</a> - textul adresa mail va face legatura catre o aplicatie de posta electronica 10. Inserarea imaginilor in pagina web Se realizeaza folosind elementu img, prin marcajul <img>, de tip nepereche. Identificarea imaginii inserate se face prin atributul src (source) al elementului img. Daca imaginea se afla in acelasi director cu documentul html in care se insereaza imaginea, atnci se specifica doar numele imaginii, respective extensia: <img src=nume_imagine.gif> Altfel, adresa fisierului in care se afla imaginea trebuie specificata complet: <img src=c:\dir1\nume_imagine.gif> Dimensiunile imaginii se pot stabili din atributele: width si height, iar alinierea prin align, care poate lua valorile: top, middle, bottom. <img src=nume_imagine.gif align=top width=80 height=50> Inserarea unui chenar in jurul imaginii se face cu atributul border. <img src=nume_imagine.gif border=6>