Introducere HTML

Structura unei pagini

Orice pagina incepe si se sfarseste cu tagurile:O pagina trebuie sa aiba tagurile: -contine informatii despre pagina respectiva; -contine corpul paginii;O structura a unei pagini HTML :

titlul paginii Corpul paginii

Atribute HTMLAtributele sunt ca o descriere pentru taguri, elemereu au nume si o valoare. Un atribut se scriesub forma: nume=valoare si se introduce intag sub forma: Ex: La tagul body putem sa adaugamatributul bgcolor cu valoarea yellow subforma:

Aici se pune titlul paginii Corpul paginii

Atributul bgcolor schimba fundalul unei pagini. Puteti sa-i dati ca valoare orice culoare in limba engleza.

Atributul align pozitioneaza un element. Ex: - pune un text antet pe centru Titlul paginii Header centrat

align="center" - aliniaza in centrualign="left" - aliniaza la stangaalign="right" - aliniaza la dreapta

Atibutul si valoarea se adauga n tagul de deschidere.De retinut ca:-un tag poate sa aiba oricate atribute;-unele taguri suporta doar anumite atribute;-atributele au valori standard;

Text HTMLTextul se poate introduce si fara taguri. Dar daca dorim sa avem un text de o anumita forma atunci introducem textul in taguri ca si cele de mai jos: -defineste text ingrosat -defineste text italic; - defineste text subliniat

TAGURILE FONT SI BASEFONTTag-ul este utilizat pentru a modifica tipul textului, marimea si culoare. Foloseste atributele "size", "color", si "face" pentru a personaliza textul.

Foloseste tag-ul pentru a seta culoarea marimea si stilul intregului text.

1.Marimea fontuluiExemplu: Acesta este un font de marime 5

2.Culoarea fontuluiExemplu:This text is red3.Tipul fontuluiExemplu:

This paragraph has had its font...

Utilizare Exemplu:

This paragraph has had its font...This paragraph has had its font... This paragraph has had its font...

Anteturi:HTML adauga automat o linie goala in plus inainte si dupa un antet. -defineste un antet de cea mai mare marime; -defineste antetul de cea mai mica marime;

- cu acest tag se scrie un comentariu in html source code , comentariu este ignorat de browser .

&nbsp -este folosit ca spatiu&copy -copyright- &reg -marca inregistrata-

FundalTagul are doua atribute unde puteti specificafundalurile. Acestea pot fi o culoare sau o imagine.Atributul bgcolor seteaza fundalul drept o culoare.

Atributul background seteaza fundalul drept o imagine.

Imagini HTMLCu HTML puteti afisa imagini intr-un document. In HTML,imaginile sedefinesc cu tagul . Tagul nu are tag de inchidere. Pentru a afisao imagine pe o pagina, trebuie sa folositi atributul src.Src inseamna "sursa". Valoarea acestui atribut este adresa imaginii pe care vreti s-o afisati pepagina.

Atributul alt ii spune celui ce vede pagina ce se afla in locul imaginii daca browser-ul nu poate incarca imagini.

Atribute ale tagului width = latimea imaginiiheight = inaltimea imaginiiborder = chenar (0 = lipsa bordura)align = alinierea imaginii

Exemplu: o imagine cu latime 100px, inaltime 75px, alt=poza si border=1

Daca doriti ca textul sa incadreze imagineaadaugati etichetei img atributul align

text text text text text text text text text text text

LINK-uriHTML foloseste un hiperlink pentru a se lega de alt document web. HTML foloseste tagul ancora sau pentru a crea un link catre alt document . Oancora poate duce catre orice resursa de pe Web: o pagina HTML, oimagine, un fisier sunet, un film, etc . Textul ce va fi afisat Cu atributul target, puteti indica unde sa deschideti documentul catre care se face link-ul.target= "_self" Incarca noul document in aceeasi fereastra cu ancora (implicit).target= "_blank" Incarca noul document intr-o fereastra noua.

Puteti sa combinati tag-ul imagine cu cel de ancora si sa puneti un link peimagine.

TabeleCu HTML se pot crea tabele. Tabelele se definesc cu tagul . Un tabel este divizat in randuri (cu ajutorul tagului ) si fiecare rand este impartit in celule de date (cu ajutorul tagului ). Td inseamna "table data" si este continutul unei celule de date. O celula de date poate contine text, imagini, liste, paragrafe, formulare, linii orizontale, tabele etc.

Tabel randul 1, celula 1 randul 1, celula 2 randul 2, celula 1 randul 2, celula 2

Daca border="0" tabelul va exista dar va avea border-ul invizibil.Cu cat nr border-ului va creste border-ul va fi mai ingrosat.

Tabel randul 1, celula 1 randul 1, celula 2 randul 2, celula 1 randul 2, celula 2

Liste HTMLHtml suporta liste neordonate si ordonate. Ex de lista neordonata:

Titlul paginii element1 element2

Prin semnul din fata poate fi modificat. , ,

Ex de lista ordonata:

Titlu element1 element2

Initial in fata va aparea 1. , 2. .Prin: type"A" se va schimba in A. , B. , C. ,etc.type"a" se va schimba in a. , b. , c. ,etc.type"I" se va schimba in I. , II. , III. ,etc.type"i" se va schimba in i. , ii. , iii. ,etc.

Forms (Formulare)

Tagul

.controale.

Nu pot fi imbricatePot fi puse oricate intr-o pagina

; atribute esentialeaction URL-ul scriptului care va prelucra

datele din formular (poate fi si o adresa de mail)method modul de transmitere a datelor

valorile pot fi: - get datele sunt atasate la url url?camp1=val1&camp2=val2 maxim 1K - post datele sunt transmise separat pot fi de ordinul mega

Camp de editare

Atribute: - value textul initial din camp - size latimea campului de editare - maxlength nr. maxim de caractere ce vor fi transmise

Butonul submit

Atribute: - value textul care va aparea pe buton - name numele ce va fi transmis (important daca sunt mai multe astfel de butoane intr-un form)Poate lipsi daca formul contine doar un singur camp de editare (locul lui il tine enter)

Butonul reset

Atribute: - value textul care va aparea pe buton Reseteaza valoarea tuturor campurilor la valoarea default

Butoane

Atribute: - value textul care va aparea pe buton - name

Genereaza un eveniment care poate fi tratat (in JavaScript)

Tagul Atribute: - name - value - type (valori: submit, reset, button)In acest fel pot fi folosite imagini pe post de butoane

Campul password

La fel ca la campurile de editare, dar textele nu sunt afisate

Tagul Atribute: - name - cols latimea - rows numarul de linii - wrap valori: off, hard, soft

Butoane radio

Atribute: - name (butoanele radio din aceeasi familie trebuie sa aiba acelasi nume) - value valoarea care se transmite - checked

Checkbox

Atribute: - name - value valoarea care se transmite - checked

Casete file

Liste de selectieTagul Atribute: - name - size cate elemente sunt vizibile - multipleFiecare element al listei este introdus cu tagul (atribute value si selected)

Alte aspecteAtributul disabled