HTML
HTML (abreviere de la Hypertext Markup Language) reprezintă structura oricărei pagini Web.
HTML nu este un limbaj de programare, nu sunt variabile, expresii, tipuri de date, structuri de control. HTML este un limbaj descriptiv, prin care sunt descrise elementele structurale ale paginii de Web: titlurile, listele, tabelele, paragrafele, legăturile cu alte pagini, precum şi aspectul pe care îl are pagina din punct de vedere grafic.
HTML este modul în care îi comunicam browserului ce elemente dorim să introducem în pagina Web și care este aspectul acestora.
HTML nu este limbaj case-sensitive, nu face distincția între literele mici şi cele majuscule. Ceea ce înseamnă că indiferent cum scriem etichetele, cu litere mari sau cu litere mici, ele vor fi corect interpretate de browser. Astfel, vom utiliza o convenție de notație în care tag-urile (etichetele) HTML sunt scrise cu majuscule iar atributele asociate sunt scrise cu litere mici pentru o diferențiere mai bună și evidențierea acestora.
1. Taguri (Elemente de baza)
<HTML> </HTML> |
Definește un fișier in format Web |
<HEAD> </HEAD> |
Antetul documentului |
<TITLE> </TITLE> |
Titlul documentului |
<BODY> </BODY> |
Corpul paginii HTML |
BGCOLOR = culoare |
Culoarea de fond a paginii |
TEXT=culoare |
Culoarea textului pe paginii |
LINK=culoare |
Culoarea legaturiilor nevizitate din paginii |
VLINK=culoare |
Culoarea legaturiilor vizitate din paginii |
ALINK=culoare |
Culoarea legaturiilor pe durata clicului executat de utilizator |
BACKGROUND = url |
Imaginea de fond pentru pagina |
<P> |
Paragraf |
<Hn> <Hn> |
Nivel de subtitlu al documentului (n = 1-6) |
<FONT> </FONT> |
Specifica atribute ale textului încadrat |
SIZE=n |
Dimensiunea textului este 1-7 |
FACE="a,b" |
Specifica fontul: a, dacă este disponibil, sau b |
COLOR=s |
Culoarea textului: fie un nume de culoare , fie o valoare RGB |
<BR> |
Linie noua |
<PRE> </PRE> |
Informație pre formatata |
<!-- --> |
Comentariu HTML |
<CENTER> </CENTER> |
Centreaza materialul in pagina |
<HR> |
Rigla orizontala |
SIZE=x |
Înălțimea riglei in pixeli |
WIDTH=x |
Lățimea riglei in pixeli sau in procente |
NOSHADE |
Dezactivează afișarea umbrei pentru rigla orizontala |
ALIGN=x |
Alinierea riglei orizontala in pagina (left, center, right) |
COLOR=x |
Culoarea riglei orizontale(numai pentru IE) |
<A> </A> |
Marcaj de tip ancora |
HREF=url |
Referința hipertext |
HREF=#nume |
Referința către o ancora interna |
Name=nume |
Definiția unei ancore interne |
2. Elemente pentru liste
<DD> |
Descriere definiție |
<DL> </DL> |
Lista de tip definiție |
<DT> |
Termen de definiție |
<LI> |
Element de lista |
<OL |
Lista ordonata (numerotata) |
TYPE=tip |
Tipul numerotării. Valori posibile: A, a, I, i, 1 |
START=x |
Numarul de început al listei ordonate |
<UL |
Lista neordonata (marcata) |
TYPE=forma |
Forma marcajului. Valori posibile: circle, square, disc. |
3. Elemente pentru formatarea caracterelor
<B> </B> |
Afișează text cu caractere aldine |
<I> </I> |
Afișează text cu caractere cursive |
<U> </U> |
Afișează text subliniat |
<TT> </TT> |
Text cu font monospațiatu |
<CITE> </CITE> |
Citare bibliografica |
<CODE> </CODE> |
Listing de program |
<EM> </EM> |
Stil logic de evidențiere |
<KBD> </KBD> |
Text de la tastatura |
<STRONG> </STRONG> |
Evidențiere logica puternica |
<VAR> </VAR> |
Program sau variabila |
<BASEFONT SIZE = n> |
Specifica dimensiunea implicita a fontului din pagina |
4. Elemente pentru cadre
<FRAMESET> </FRAMESET> |
Definirea redactării paginii |
COLS=x |
Numarul și mărimea relativa a coloanelor |
ROWS=x |
Numarul și mărimea relativa a liniilor |
BORDER=x |
Specifica starea "on" (activa) sau "off" (inactiva) pentru chenarul cadrului FRAMESET (1 sau 0) |
FRAMEBORDER = x |
Specifica mărimea chenarului |
FRAMESPACING = x |
Mărimea spațiului dintre doua cadre adiacente |
<FRAME> |
Definiția unui anumit cadru |
SRC=url |
URL-ul sursa pentru cadru |
NAME=nume |
Numele cadrului (utilizat împreună cu TARGET=nume ca parte componenta a marcajului de tip ancora <a> |
SCROLLING=scrl |
Definește opțiunea barei de derulare.Valori posibile: on(activa), off(inactiva), auto (automat) |
FRAMEBORDER=x |
Mărimea chenarului din jurul cadrului |
MARGINHEIGHT=x |
Spațiul suplimentar de deasupra și dedesubtul unui anumit cadru |
MARGINWIDTH=x |
Spațiu suplimentar la stânga și la dreapta unui anumit cadru |
<NOFRAMES> </NOFRAMES> |
Secțiunea de pagina afișata pentru utilizatorii care nu pot vedea un cadru |
<IFRAME> |
Cadru intern (numai pentru (IE) |
SRC=url |
Sursa cadrului |
NAME=s |
Numele ferestrei (util pentru TARGET) |
HEIGHT=x |
Înălțimea cadrului înglobat |
WIDTH=x |
Lățimea cadrului înglobat |
5. Elemente pentru tabele
<TABLE> </TABLE> |
Tabel HTML |
BORDER=x |
Chenarul tabelului |
CELLPADDING=x |
Spațiul suplimentar in cadrul celulelor tabelului |
CELLSPACING=x |
Spațiul suplimentar intre celulele tabelului |
WIDTH=x |
Lățimea impusa tabelului |
FRAME=valoare |
Ajustarea fina a tabelului |
RULES=valoare |
Ajustarea fina a riglelor tabelului |
BORDERCOLOR = culoare |
Specifica culoarea chenarului tabelului |
BORDERCOLORLIGHT = culoare |
Cea mai deschisa culoare din cele doua culori specificate |
BORDERCOLORDARK = culoare |
Cea mai închisa culoare din cele doua culori specificate |
ALIGN=left |
Aliniază tabelul la marginea din stânga a paginii, iar textul curge in partea dreapta |
ALIGN=right |
Aliniază tabelul la marginea din dreapta a paginii, iar textul curge in partea stânga |
HSPACE=x |
Spațiu suplimentar pe orizontala in jurul tabelului |
VSPACE=x |
Spațiu suplimentar pe verticala in jurul tabelului |
COLS=x |
Specifica numărul de coloane ale unui tabel |
<COLGROUP> </COLGROUP> |
Definește un set de definiții de coloane cu ajutorul marcajului <col> |
<COL WIDTH=x> |
Definește lățimea unei coloane exprimata in pixeli |
<THEAD> </THEAD> |
Definește titlul tabelului |
<BODY> </TBODY> |
Definește corpul tabelului |
<TR </TR> |
Linie de tabel |
BGCOLOR=culoare |
Specifica culoarea de fond pentru întreaga linie |
ALIGN=aliniere |
Alinierea celulelor de pe linia curenta (left, center, right) |
<TD </TD> |
Celula de date a tabelului |
BGCOLOR=culoare |
Specifica culoarea de fond pentru celula de date |
COLSPAN=x |
Numarul de coloane pe care se întinde celula curenta de date |
ROWSPAN=x |
Numarul de linii pe care se întinde celula curenta de date |
ALIGN=aliniere |
Alinierea materialului din cadrul celulei de date.Valori posibile: (left, right, center) |
VALIGN=aliniere |
Alinierea pe verticala a materialului din cadrul celulei de date.Valori posibile: (top, bottom, middle) |
BACKGROUND=url |
Specifica imaginea de fond pentru celula tabelului |
NOWRAP |
Nu permite despărțirea textului pe linii in cadrul unei celule |
ALIGN=baseline |
Aliniază celule de date cu linia de baza a textului adiacent |
ALIGN=caracter |
Aliniază o coloana fata de un anumit caracter (caracterul prestabilit este ".") |
ALIGN=justify |
Aliniază atât marginea din stânga cat și marginea din dreapta a unui text |
6. Elemente pentru adăugarea imaginilor
<IMG |
Marcajul de introducere a imaginilor |
SRC=url |
Sursa fișierului grafic |
ALT=text |
Textul alternativ de afișat, dacă este necesar |
ALIGN=aliniere |
Alinierea imaginii in pagina. Valori posibile: top (sus), middle(in mijloc), bottom (jos), left (in stânga), right (la dreapta) |
HEIGHT=x |
Înălțimea imaginii (in pixeli) |
WIDTH=x |
Lățimea imaginii |
BORDER=x |
Chenarul din jurul imaginii, atunci când aceasta este utilizata ca hiperlegătură |
HSPACE=x |
Spatiul suplimentar pe orizontala din jurul imaginii (in pixeli) |
VSPACE=x |
Spatiul suplimentar pe verticala din jurul imaginii (in pixeli) |
7. Elemente pentru formulare
<FORM> </FORM> |
Formular HTML activ |
ACTION=url |
Programul CGI de pe serverul care recepționează datele |
METHOD=metoda |
Modul in care datele sunt transmise serverului(GET sau POST) |
<INPUT |
Camp de text sau alte date de intrare |
TYPE=opțiune |
Tipul câmpului de intrare <INPUT>. Valori posibile: text,password,checkbox,hidden,file, radio,submit,reset,image. |
NAME=nume |
Numele simbolic al valorii câmpului |
VALUE=valoare |
Conținutul prestabilit al câmpului de text |
CHECKED= opțiune |
Buton/caseta marcata in mod prestabilit |
SIZE=x |
Numarul de caractere al unui camp de text |
SIZE=x |
Numarul maxim de caractere acceptate |
<SELECT> </SELECT> |
Grup de casete de validare |
NAME=nume |
Numele simbolic al valorii câmpului |
SIZE=x |
Numarul de articole de meniu care se afișează odată (prestabilit=1) |
MULTIPLE=x |
Permite selecția unor articole de meniu multiple |
<OPTION |
Alegerea particulara într-un domeniu <SELECT> |
VALUE=valoare |
Valoarea rezultanta a acestei selecții din meniu |
<TEXTAREA> </TEXTAREA> |
Camp de intare de tip text pe linii multiple |
NAME=nume |
Numele simbolic al valorii câmpului |
ROWS=x |
Numarul de linii al casetei de text |
COLS=x |
Numarul de coloane (caractere) pe linie al casetei de text |
<FIELDSET> </FIELDSET> |
Împarte formularul in parți logice |
<LEGEND> </LEGEND> |
Numele asociat setului de câmpuri (fieldset) |
ALIGN=s |
Specifica alinierea legendei (explicației) afișate (top,bottom,left,right) |
TABINDEX=x |
Specifica ordinea elementelor atunci când utilizatorul apasă tasta Tab |
ACCESKEY=c |
Specifica tasta care asigura comanda rapida de la tastatura asociata unui anumit element |
DISABLED |
Elementul este inactiv, dar este afișat pe ecran |
READONLY |
Elementul este afișat pe ecran dar nu poate fi editat |
8. Elemente avansate
<STYLE> </STYLE> |
Specifica informații referitoare modelul de stiluri |
TYPE=val |
Tipul modelului de stiluri. De regula "text/css" |
<SCRIPT> </SCRIPT> |
Include un script de regula Javascript, in pagina Web |
LANGUAGE=limbaj |
Limbajul utilizat |
EVENT=eveniment |
Eveniment care declanșează execuția unor scripturi specifice |
FOR=numeobiect |
Numele obiectului din pagina asupra căruia acționează scriptul |
Caractere speciale româneşti
ă |
ă |
ş |
ş |
ţ |
ţ |
î |
î |
â |
â |
Ă |
Ă |
Ş |
Ş |
Ţ |
Ţ |
Î |
Î |
 |
 |