WEBDESIGN

Conf. dr.Livia SANGEORZAN

I. Consideraii generale privind Internet i World Wide Web
La ora actual n lume exist milioane de calculatoare, care sunt folosite n cele mai diverse
domenii, multe dintre aceste calculatoare sunt legate ntre ele, interconectate n forma
reelelor de calculatoare. Multe din aceste reele sunt la rndul lor conectate ntre ele,
formnd inter-reele (reele de reele de calculatoare). Denumirea de internet desemneaz o
reea de reele (net nsemnnd n lim!a englez reea). "ea mai mare intereea #u!lic
(reea de reele de calculatoare cu acces #u!lic) este reeaua $nternet.
%rinci#ala atracie a $nternetului o re#rezint &orld &ide &e!-ul. 'cesta a constituit #artea
cu dezvoltarea cea mai ra#id (i cea mai #o#ular a $nternetului (cu exce#ia, #ro!a!il, a
fluxului voluminos de e-mail de #e tot glo!ul). Din #unct de vedere te)nic &e!-ul, nu este
dect o #arte a $nternetului sau mai corect s#us, o com#onent, care #ermite navigarea #rin
$nternet.
&e!-ul re#rezint o interfa, o fereastr s#re $nternet sau o metod de a a*unge n locurile
dorite. %o#ularitatea sa deriv din trei as#ecte distincte (i anume+
Mascheaz lim!a*ul #retenios folosit #entru adresele $nternet (i #entru
comenzile s#ecifice.
Gr!eaz mai multe com#onente diferite ale $nternetului ntr-o singur interfa.
"er#i$e ca #e lng citirea textului s se vizualizeze imagini, s se asculte sunete
(i c)iar s se urmreasc filme (n ra#ort de resursele calculatorului - client).

,n #as im#ortant n evoluia &e!-ului a fost dezvoltarea !ro-sererelor grafice, care #uteau
fi rulate #e un %" des.to# sau #e un Macintos), #ermind utilizatorului s foloseasc
te)nicile familiare dis#oni!ile (i n alte #rograme, ncor#ornd formate de text (i grafic n
ecranul de navigare etc. %rimul #rogram de acest ti# a fost /"0' Mosaic, dezvoltat de
centrul naional #entru a#licaii de su#ercalculatoare (i distri!uit gratuit.
&e!-ul a #ermis !ro-serelor s afi(eze imagini c)iar n mi*locul textului, fr a fi nevoie s
se cunoasc metoda de decodificare a fi(ierelor. 0#eciali(tii n mass media afirm c o
imagine conteaz ct o mie de cuvinte, imaginile din articolele de ziar sau din emisiunile 12
fiind incom#ara!il mai sugestive dect (iruri lungi de text scris la ma(in. Deci acest
ingredient final a #ermis ca &e!-ul s #ar att sensi!il, ct (i interesant #entru #ersoana care
nu ar fi nvat niciodat ce nseamn o ex#resie o!i(nuit in ,nix.
"reatorii de !ro-se /estca#e (i Microsoft ncearc fiecare s dezvolte soluii glo!ale care s
transforme #rodusele #ro#rii n #latforme ale tuturor o#eraiilor din $nternet. La ora actual
existz com#anii care ofer conturi $nternet gratuite, avnd o interfa #entru e-mail !azat
#e &e!. 3ratuitatea gzduirii site-urilor este condiionat de meninerea #e ecran a unei
ferestre #u!licitare. 4xist (i alte modaliti de a intra in lumea $nternetului, fr a fi nevoie
de un calculator, cum ar fi &e! 12 (#entru care este nevoie de un televizor, un modem, o
5
tastatur (i o telecomand), sau a unui modem, cum ar fi Direct%" (este nevoie de un
calculator (i de o anten s#ecial #entru satelit).
Dezvoltarea $nternetului, com!inat cu a#ariia reelelor de ti# $nternet locale, de dimensiuni
mai mici, care funcioneaz du# #rinci#iile $nternetului, a dus la cerine din #artea
utilizatorului #entru ca #artea de soft-are s i a*ute s recu#ereze documentele de la
distan, s cola!oreze #rin intermediul legturilor de reea (i s salveze sau s #u!lice
documente. %entru a nde#lini aceste cerine, #roductorii de soft-are au adugat
com#onentele $nternet la #rogramele lor.
6 mare #arte din elegana $nternetului const n cantitatea im#resionant de #utere de
#relucrare (i de stocare a #rogramelor de dimensiuni mari (i a informaiilor dense, o#eraii
care au loc n $nternet (i nu n calculatorul #ro#riu. "alculatorul #ro#riu - fie c este un %",
un Mac sau o staie de lucru ,nix - rmne doar o ram# de lansare ctre lumea $nternetului.
'ceast structur comun de faciliti $nternet este referit uneori cu ex#resia client-server.
"alculatorul #ersonal (sau #rogramul care ruleaz #e acesta) este clientul, iar sursa de
informaii sau site-ul &orld &ide &e! este serverul. 0erverele re#rezint de#ozite
centralizate de informaii sau de mani#ulatori s#ecializai #entru anumite ti#uri de trafic.
"lientul nu tre!uie dect s se conecteze la serverul #otrivit (i astfel foarte multe lucruri
interesante vor fi la dis#oziia sa, fr a fi nevoie s su#rancarce calculatorul #ro#riu. 'cesta
este unul din #rinci#alele motive #entru care nu are im#ortan ce ti# de calculator se
utilizeaz.
&&& este un sistem distri!uit. $nformaiile sunt #lasate n mii de site-uri. "nd utilizatorul
dore(te o informaie, a#eleaz site-ul care a #u!licat-o. 7iecare site (i fiecare #agin de
informaii au o adres unic numit ,8L (,niform 8esource Locator ,8L 9 identificator
uniform al resursei). 'ceat informaie #u!licat ntr-un site #oate fi oricnd actualizat de
autorul site-ului.&&& devine din ce n ce mai mult un sistem interactiv. 4voluia
te)nologiilor &e! l transform ntr-un mediu de comunicare. De exem#lu, includerea
formularelor n #aginile &e! #ermite colectarea de informaii de la utilizator.
1ermeni care se ve)iculeaz n lumea &e!-ului sunt+
%os$ : "om#uter legat la $nternet care gzduie(te unul sau mai multe servere;
Server We& ' 0oft-are care administreaz site-uri -e!;
Si$e We& : "olecie structurat de #agini -e!;
"a(in )doc#en$* +e& : "oninutul unui fi(ier, afi(at ca urmare a unei cereri a
utilizatorului;
"a(in ho#e : %agina de intrare a unui site.
,n )ost #oate gzdui mai multe ti#uri de servere (71%, 3o#)er, &e!). 7iecare ti# de server
are #ro#riul ti# de comunicaie cu $nternet-ul. %rotocolul de comunicaie al server-elor -e!
se nume(te <11% (<=#er 1ext 1ransformer %rotocol).
,n server -e! administreaz mai multe site-uri -e!. ,n site conine una sau mai multe
#agini ntre care exist legturi. %agina )ome este intrarea n site.
Browsere WEB
%entru a accede la -e!, utilizatorul tre!uie s ai! instalat #e com#uterul su un !ro-ser.
>ro-ser-ul este o a#licaie cu trei funcii #rinci#ale+ accesul la informaii, formatare (i
afi(area informaiilor. ,tilizatorul furnizeaz !ro-ser-ului adresa #aginii dorite (,8L-ul).
?
>ro-ser-ul solicit conectarea la server-ul -e!, #e !aza #rotocolului <11%. 6 dat
conectarea acce#tat, server-ul transmite !ro-ser-ului fi(ierul cerut. >ro-ser-ul formateaz
#agina (i o afi(eaz #e monitorul utilizatorului.
7ormatarea se face n funcie de+
indicaiile de formatare coninute n fi(ierul #rimit;
caracteristicile #latformei cu care lucreaz utilizatorul.
%iaa are o ofert !ogat de !ro-sere dis#oni!ile #entru diverse #latforme. 4xist !ro-sere
o#eraionale #e sisteme cu interfa grafic (Macintos), &indo-s), dar (i #e sisteme cu
interfa exclusiv textual. %oziia dominant #e #ia este ocu#at de Microsoft $nternet
4x#lorer ($4) (i /etsca#e /avigator (//). $4 este o#eraional su! &indo-s (nce#nd cu
@.5), su! ,/$A (i #entru calculatoare '##le. /etsca#e /avigator este com#onent a unui set
de instrumente $nternet, numit /etsca#e "ommunicator al firmei /etsca#e "ommunications
"or#oration. "om#onenta numit /etsca#e "om#oser #ermite editarea #aginilor &e!.
/etsca#e /avigator este o#eraional su! &indo-s, su! anumite versiuni ,/$A (i #entru
'##le.
Primii pasi catre constructia unui site
Daca se doreste realizarea unei #agini ---, tre!uie sa a#elam la o firma s#ecializata ,
numita #rovider. %rovider-ul dis#une de mai multe calculatoare foarte #erformante, numite
server-e si #un la dis#ozitie+
s#atiu #e )ard-ul server-ului de cel #utin 5B M>;
o adresa de $nternet, de exem#lu + ---.adresaCstudent.ro.
$n s#atial rezervat se #ot #une mai multe fisiere care contin instructiuni <1ML dar si orice
alte fisiere.
Defini$ie ) ,-.*+
%rin si$e se intelege ansam!lul +
s#atiu )ard;
fisierele #e care le contine;
adresa
%rin !a(ina se intelege continutul afisat al unui fisier <1ML.
Defini$ie ) ,-.*+
'nsam!lul regulilor care tre!uiesc res#ectate #entru sc)im!l informatiilor de un anumit ti#
se numeste !ro$oco/.
Daca dorim sa transferam fisiere catre server sau invers, de la server catre #ro#riul calculator
se utilizeaza #rotocolul 01" ( 7ile 1ransfer %rotocol).
%entru a realize o #agina atractiva este !ine sa se utilizeze un design adecvat. $n acest sco#
vom utilize lim!a*ele+
Dava0cri#t,
@
%<%
Dava ('##let)
7las)
etc.
1otodata este im#ortant de a fi initiat in #e$ode de desi(n
1re!uie de avut in vedere ca 2avaScri!$ ruleaza #e calculatorul vizitatorului , o secventa
Dava0cri#t este tradusa si executata de catre !ro-ser si este trimisa acestuia odata cu fisierul
<1ML.
Lim!a*ul "%" este un lim!a* de #rogramare ce ruleaza server, #roiectat s#ecial #entru &4>.
$ntr-o #agina <1ML #utem inglo!a cod %<% care va fi executat la fiecare vizitare a #aginii.
Lim!a*ul %<% #ermite lucrul cu !aze de date, in M=0El.
Mysql este un sistem de gestiune a !azelor de date, foarte ra#id si ro!ust.
'#licatiile scrise in %<% si M=0El se ruleaza #e server.
'tentie + /u toti #rovider-ii #un la dis#ozitie utilizatorilor #osi!ilitatea utilizarii acestor
lim!a*e, deci o sa tre!uiasca sa studiem oferta .
. .
F
II. Principii de baza in design
6ricine #oate sa invete te)nicile crearii unei #agini &e!. 0i oricine #oate sa creeze o #agina
&e! urata. 1otusi singurul motiv #entru care atatea #ersoane realizeaza #agini -e! sla!e este
fa#tul ca nu cunosc #rinci#iile de !aza ale designului. /otiunile de GinterfataH si
GnavigareHsunt im#ortante in realizarea unui design atragator , dar necesita si un #ic de
gandire si #lanificare. "once#tele utilizate sunt lucruri foarte sim#le, care vor sc)im!a ra#id
si cu usurinta !analele #agini &e!, in #agini cu as#ect mult mai #rofesionist.
"ele #atru #rinci#ii de !aza, care #ermit ca o #agina &e! sa arate clara, ordonata si
#rofesionista sunt+
a/inierea;
!ro3i#i$a$ea4
re!e$area ;
con$ras$/.
'cestia sunt factorii de !aza ai oricarei lucrari ti#arite #e ecran sau altundeva.
Aliniere
A/inierea inseamna ca elementele de #e #agina sunt aliniate unele in ra#ort cu celalalte.
Li#sa alinierii este #rinci#ala #ro!lema de #e #aginile &e!, aceasta re#rezinta o #ro!lema
im#ortanta si #e #aginile ti#arite, insa #are si mai #rezenta si mai dezastroasa #e #aginile
&e!. /imic nu tre!uie asezat la intam#lare #e #agina. 0e creeaza un as#ect curat, sofisticat
si #roas#at al #aginii daca fiecare element are o legatura vizuala cu un alt element de #e
#agina.
'linierea elementelor du#a latura stanga, drea#ta sau centrat tre!uie sa urmeze o anumita
regula, si anume+
A/e(e$i 5NA. Se alegei o singura aliniere care se utilizeaza pe toata pagina.
Daca se o#teaza a se alinia textul de !aza in stanga, nu se #une titlul #e centru;
Daca se aliniaza centrat o #arte din text, atunci se aliniaza centrat #este tot.
N a#es$eca$i a/inieri/e.
'cest singur #rinci#iu va modifica radical as#ectul #aginilor.
0e #ot face alinieri verticale orizontale si centrale.
6 aliniere cen$ra/a se #oate s#une ca este +
ec)ili!rata;
simetrica;
calma;
oficiala.
'liniind o #arte din text la stanga, o #arte la drea#ta si o #arte centrat, se creaza senzatie de
dezordine si se transmite im#resia de amatorism.
Daca se aliniaza textul si imaginile, este !ine sa inde#artam textul de marginea stanga. 4ste
o!ositor si distrage atentia sa dam cu oc)ii de marginea stanga a #aginii !ro-serului de
fiecare data cand trecem la randul urmator. "and decalam text (o#eratie de GindentareH), se
#oate face si din #artea drea#ta, im#iedicand formarea randurilor de text lungi si dificil de
citit.
1e3$ !e &$oane ne(/i6en$ rea/iza$ )vezi fi(ra de #ai ss*
I
'linierea orizon$a/a este la fel de im#ortanta ca si cea ver$ica/a. 4ste im#ortant sa vedeti
!utoane ca in exem#lul de mai sus, in care literele nu se aliniaza #e orizontala. 'ceasta
de#lasare GsusJ*osJsusJ*osH face ca toata manseta sa arate dezordonata. De aceea, #e langa
alinierea verticala tre!uie sa fim atenti si la alinierea orizontala a !utoanelor si legaturilor.
1e3$ !e &$oane corec$ rea/iza$ )vezi fi(ra de #ai ss*
Literele stau #e o linie invizi!ila numita Glinie de !azaH. Manseta de legaturi este mai
ordonata si mai organizata daca aliniem tot textul #e aceeasi linie de !aza,. $n ma*oritatea
soft-are-urilor de creatie #entru &e! exista un !uton #entru alinierea du#a linia de !aza, de
o!icei in s#ecificatiile #entru ta!ele.
0or#/ar incorec$ rea/iza$ din !nc$ de vederea a/ +e&desi(n7/i )vezi for#/ar/ de
#ai ss*
7ormularul acesta ince#e excelent; exista cateva alinieri foarte !une, !ine definite, dar si
locuri in care textul #are sa fi fost trantit aleatoriu #e #agina.
'liniere verticala in #artea laterala a formularului lasa de dorit. "onsolidam as#ectul #aginii,
aliniind celalalte elemente du#a aceasta linie.
1otul tre!uie sa ai!a un motiv #entru a-si *ustifica locatia deoarece, nimic nu tre!uie #lasat
ar!itrar #e #agina. /u azvarlim #ur si sim#lu elementele si vedem cum si unde se li#esc.
1re!uie sa #utem ex#lica motivul #entru care un element se afla in acel loc.
K
6 #agina, #oate sa fie instantaneu folosita, #rin alinierea tuturor elementelor du#a o latura si
#agina arata mult mai organizata. Daca lucrurile sunt organizate, ele comunica mai !ine.
'linierea nu inseamna ca totul este aliniat du#a aceeasi latura. $nseamna #ur si sim#lu ca
totul are aceeasi aliniere : fie li#it la stanga, fie li#it la drea#ta, fie centrat.
"and o margine !una se re#eta, ea castiga in forta.
0or#/ar corec$ rea/iza$ din !nc$ de vederea a/ +e&desi(n7/i )vezi for#/ar/ de
#ai ss* Mai sus am dat un mod de aliniere o#tim, #entru formularul creat anterior. 0e
o!serva linia verticala du#a care se aliniaza casutele text, c)ec.!ox sau cea de su!mit.
7oirmularul arata mult mai !ine.
Proximitatea
"ro3i#i$a$ea se refera la relatiile dintre elemente, cand acestea sunt foarte a#roa#e. %e o
#agina com#onentele aflate in legatura cu altele tre!uie sa fie gru#ate. Daca anumite
com#onente se afla in a#ro#ierea altora, ele devin o singura unitate d.#.d.v. vizual, astfel
informatiile #ot fi organizate mai !ine si #ermite astfel sa dis#ara orice confuzie.
0e #are ca exista o frica fata de s#atiu li!er. %agina #are neorganizata, daca elementele de
mac)etare sunt im#rastiate #este tot, fiind #osi!il ca informatia sa devina mai greu accesi!ila.
%rinci#iul #roximitatii s#une ca tre!uie sa se gru#eze com#onentele aflate in legatura, sa fie
mutate mai a#roa#e unele de altele, a.i. sa fie #erce#ute ca un gru# unitar, nu ca o gramada de
elemente fara legatura. "om#onentele si gru#urile de informatii care nu au legatura unele cu
altele n tre!uie sa se afle in #roximitate (vecinatate).
Dorim sa realizam o carte de vizita care cu#rinde I elemente (com#onente ) se#arate (vezi
figura de mai *os). $n acest caz oc)iul se o#reste de cinci ori. 6c)iul ince#e sa citeasca in
mi*loc, deoarece textul este !old.
L
Daca com#licam #ro!lema, adica mai ingrosam alte elemente vom vedea ca ne vom #lim!a
#rivirea intre cuvintele ingrosate.
%roximitatea sau a#ro#ierea, inseaman o relatie.
6 #ro!lema a cartii de vizita anterioare este fa#tul ca nici una dintre com#onente nu #are a fi
in legatura cu alta. Dar daca fac o rearan*are a com#onentelor de #e cartea de vizita aceasta
arata cu totul altfel., com#onentele care au o legatura intre ele sunt gru#ate. 'ceste
com#onente sunt mai a#roa#e unele de altele (vezi figura de mai *os).
DIRECTOR S.C. PISOI (0268) 956419
VICTOR GABRIEL MOTANEL
Str. Leului nr.123 Br!"#
M
DIRECTOR S.C. PISOI (0268) 956419
VICTOR GABRIEL MOTANEL
Str. Leului nr.123 Br!"#
VICTOR GABRIEL MOTANEL
DIRECTOR S.C. PISOI
Str. Leului nr.123
Br!"#
(0268) 956419
,neori, atunci cand se gru#eaza com#onentele foarte a#ro#iate, este nevoie sa se modifici
cate ceva, de exem#lu, marimea, #onderea sau asezarea textului ori a desenelor.
"om#onente aflate in a#ro#iere unele de altele devin o unitate vizuala, nu tre!uie organizate
ca unitati se#arate. Deci com#onentele cu legatura intre ele tre!uie gru#ate im#reuna.
%rinci#iul #roximitatii are ca sco# de !aza organizarea #aginii.
Daca #e #agina exista mai mult de trei #ana la cinci com#onente, tre!uie vazut care dintre
elementele se#arate #ot fi gru#ate, mai a#ro#iat, #entru a deveni o unitate vizuale.
%roximitate nu inseamna ca totul este a#ro#iat, ci ca elementele care sunt legate din #unct de
vedere al semnificatiei lor, intre care exista un fel de relatie #rivitoare la ceea ce comunica,
tre!uie sa fie conectate si vizual
$nformatia dintr-o #agina tre!uie mai intai gru#ata din #unct de vedere al semnificatiei, a#oi
asezata din #unct de vedere fizic #e #agina. $nformatia secundara tre!uie sa fie mai
distantata, astfel icat sa se vada ca este vor!a des#re o com#letare a informatiei #rinci#ale.
Repetitia
%rinci#iul re!e$i$iei s#une ca anumite #arti ale mac)etarii tre!uie re!e$a$ in intreaga lucrare.
0e #oate re##eta de exem#lu un font ingrosat, o linie groasa, un anumit ti# de marca*, un
element de design etc. %oate fi orice e/e#en$ care #oate fi recunoscut de vizitator.
8eluam cartea de vizita si organizam informatia altfel (vezi figura de mai *os).
6!servam ca du#a ce am #rivit informatia de aceasta carte de vizita, oc)ii raman agatati de
nume, deorece este ingrosat si su!liniat.
Dar totusi avem senzatia de neterminare. ,rmatoarea figura #rezinta aceiasi carte de vizita
dar in care am ingrosat si ultima informatie, astfel oc)iul se uita la nume si la numarul de
teledon.
N
VICTOR GABRIEL MOTANEL
DIRECTOR S.C. PISOI
Str. Leului nr.123
Br!"#
(0268) 956.41.93
Contrastul
"ontrastul este cea mai eficienta cale de a adauga valoare vizuala #aginii noastre.
%rinci#iul contrastuluis#une ca daca doa co#!onen$e n sn$ e3ac$ /a fe/8 a$nci $re&ie
sa fie co#!/e$ diferi$e.
8egula de OaurH in utilizarea contrastului s#una ca #entru a fi eficient, contrastul tre!uie sa
fie #uternic.
"ontrastul #oate fi creat in mai multe moduri, de exem#lu #unem in contrast+
un font mare cu unul mic;
un font elegant cu unul ingrosat;
o culoare rece cu una calda;
un element orizontal ( ex. un rand lung de text) cu unul vertical (ex. o coloana de text
inalta si ingusta);
randuri cu s#atii multe intre ele cu randuri dese;
un desen mare cu unul mic.
'tentie nu #utem #une in contrast maro inc)is cu negru sau un font de 5F #uncte cu unul de
5K #uncte.
7ie un 'nunt #entru o!tinerea unei !urse 0ocrates in cadru 7acultatii de M$. 0unt #rezentate
doua variante. 0e o!serva ca am!ele variante contin aceleasi informatii doar ca al doilea
anunt contine mai mult contrast si ne uitam cu mult mai multa #lacere la cel de al doilea
anunt.
5B
VICTOR GABRIEL MOTANEL
DIRECTOR S.C. PISOI
Str. Leului nr.123
Br!"#
( 0268 ) 956.41.93
"ontrastul in formularul modificat este evident.
'm folosit un font mai #uternic, am ingrosat titlurile.
7ontul folosit l-am re#etat si in titlul #aginii.
1itlul l-am transformat din ma*uscule in litere mici si astfel am avut #osi!ilitatea sa folosesc
o dimensiune mai mare a fontului, #e care l-am ingrosat.
1otodata am scris titlul cu al! #e fond negru (!anda neagra). 'stfel am marit contrastul.
"ontrastul nu numai ca face #agina mai atractiva, ci si clarifica sco#ul si organizarea
documentului.
55
B$RSE SOCR%TES 200& '
Condi$ii de a!/icare
$ntegralist
De#unere dosar care sa cu#rinda + "2, 0crisoare de intentie, situatia scolara
%artici#are la testul de lim!a straina
1er#en /i#i$a de de!nere dosar la Decanatul 7acultatii M$+ 5F.BF.?BBL
5niversi$a$i !ar$enere+
,niversit= 6lden!urg
,niversit= Dortmund
,niversit= of '##lied 0ciences 7ulda,
,niversit= of '##lied 0ciences &ies!aden,
,niversit= of '##lied 0ciences Mitt-eida
5?
Burse Socrates 2007 !
Con!"!! # $%&!'$(#
$ntegralist
De#unere dosar care sa cu#rinda +
o "2,
o 0crisoare de intentie,
o situatia scolara
Participare la testul de limba straina
Termen limita de depunere dosar
Decanatul 7acultatii M$;
5F.BF.?BBL
)n!*#(+!"$"! %$("#n#(#,
,niversit= 6lden!urg
,niversit= Dortmund
,niversit= of '##lied 0ciences 7ulda
,niversit= of '##lied 0ciences &ies!aden,
,niversit= of '##lied 0ciences Mitt-eida
III HTML (Hyper Tet Mar!"p Lang"age#
,ltima versiune a <1ML-ului folose(te unele idei (i modificri #ro#use #entru <1ML @,
care au fost a!andonate la a#ariia <1ML @.?.
<1ML F #ro#une se#ararea stilurilor fizice de marcarea coninutului #rintr-o folosire mai
intens a foilor de stil. 4lementul frame este acum definit oficial altundeva dect n #rodusele
firmelor /estca#e sau Microsoft. $nclude elementele style, div, span #entru ncor#orarea
foilor de stil.
4tic)eta o!*ect este de asemenea extins, astfel s includ #ractic orice fi(ier extern care se
dore(te introdus ntr-o #agin &e!. 0unt introduse etic)etele ins (i del, acron=m, colgrou#,
fieldset, !utton.
<1ML e un lim!a* !azat #e SGML (0tandard 3eneralized Mur.u# Language 9 HLim!a*
0tandard 3eneralizat de MarcareH) care este un standard internaional ce a fost a#ro!at n
5NMK (i care #ermite crearea de documente )i#ertext #entru #aginile &e!. %rinci#alele
caracteristici ale lim!a*ului 03ML sunt+
5. Descrierea structurii documentului;
?. /u este descris aran*area n #agin;
@. %ermite fiecrui navigator s ai! #ro#ria #rezentare;
F. ,n document <1ML #oate fi reutiliza!il.
0tandardul oficial %1ML este dat de &orld &ide &e! "onsortium (&@") care este afiliat
la $nternet 4ngineering 1as. 7orce ($417). &@" a enunat cteva versiuni ale s#ecificaiei
<1ML, #rintre care (i <1ML ?.B, <1ML @.B, <1ML @.?, <1ML F.B (i, cel mai recent,
<1ML F.B5. 7iecare din aceste standarde este mai mult sau mai #uin su#ortat de ctre toate
sau o #arte din !ro-sere.
La ora actual %1ML 9.: este larg utilizat (i au fost de*a #u!licate s#ecificaiile %1ML
9.:-.
Lim!a*ul <1ML ofer #roiectanilor de #agini &e! urmtoarele #osi!iliti+
5. 0 #u!lice documente cu )eadere, texte, ta!ele, liste, fotografii, etc;
?. 0 regseascP on-line informaiile #rin intermediul )i#erlin.-urilor #rintr-un sim#lu
clic. de mouse;
@. 0 #roiecteze formulare #entru realizarea tranzaciilor cu servere aflate la distanP
#entru cutri de informaii sau #entru activiti s#ecifice comerului;
F. 0 includP foi de calcul ta!elar, cli#uri video, sunete (i alte a#licaii direct n
documente.
4lementul esenial diferit adus de versiunea F.B (i mai ales F.B5 fa de versiunea @.? este
#osi!ilitatea se#arrii structurii unui document de #rezentarea lui #rin introducerea Gstilurilor
de documenteH (st=le s)eet).
%rin utilizarea lim!a*ului <1ML #entru structurarea unui document (i st=le s)eet-urile #entru
a stiliza #rezentarea acestuia, se #oate o!ine mult mai u(or inde#endena de
#erifericJcom#uterJ#latforma )ard-soft.
5@
Lim!a*ul <1ML a fost #referat #entru #u!licaii #e &e! n #rimul rnd datorit sim#litii
sale (i n al doilea rnd deoarece #ermite formatarea textului '0"$$ cu tag-uri n format
'0"$$.
Crearea unui document HTML
HTML 9 H=#er Text Mar.u# Language este lim!a*ul de !az al &&& (i const dintr-un set
standard de coduri care s#ecific n ce mod documentele vor fi afi(ate #e ecran de ctre
navigatoare.
"aracteristica im#ortanta a lim!a*ului este +
portabilitatea Q adic orice document surs <1ML va arta identic #e orice ti# de
calculator (i n orice sistem de o#erare, sarcina inter#retrii sale revenind diverselor
navigatoare.
6rice document <1ML ince#e cu marca*ul (tag-ul) ;h$#/< (i se termin cu marca*ul (tag-
ul(;=h$#/<.
,n marca* #oate avea unul sau mai multe atri!ute care se s#ecific #rin #erec)i de forma+
n#e>?va/oare?. 0e recomand ca valorile atri!utelor s fie #lasate ntre g)ilimele ( ).
Marca*ele dintre aceste #aranteze ung)iulare transmit comenzi ctre !ro-ser #entru a afi(a
#agina ntr-un anumit mod.
Rntre cele doua marca*e S)tmlT (i SJ)tmlT a#ar dou seciuni;
5. 0eciunea de antet delimitat de marca*ele
;head< 14A1 ;=head<4
?. "or#ul documentului care este delimitat de marca*ele
;&od@< "68%,L 14A1,L,$ ;=&od@<.
,n marca* #oate fi scris att cu litere mici, ct (i cu litere mari. Deci lim!a*ul <1ML n es$e
CASE ' sensi$iv.
Comentariilor din cadrul documentelor <1ML se realizeaz utilizUnd tag-ul urmtor +
;AB'$"$ '%'84 ,/ "6M4/1'8 77<.
6rice (ir de caractere ncadrat de aceste elemente va fi ignorat de #rogramele de navigare
&e!.
0tructura de !az a unui document <1ML este+
;h$#/<
5F
;head<
$nformaia
SJ)eadT
S!od=T
"or#ul fi(ierului
SJ!od=T
SJ)tmlT
,n fi(ier <1ML este creat cu orice editor de texte cu meniunea c fi(ierul tre!uie salvat cu
extensia h$#/ sau h$#.
TAG-uri HTML
Rn lim!a*ul de marcare a )i#ertextului totul se rezum la structur. ,n lim!a* de marcare este
folosit #entru a descrie care este rolul fiecrei #ri din document n ra#ort cu celelalte.
1erminologia <1ML+
a) atribut+ furnizeaz instruciuni adiionale des#re o etic)et. $nformaiile variaz de la
etic)et la etic)et (i #ot include su!iecte cum ar fi locaia fi(ierelor, mrimea, numele lor
sau stiloul lor;
!) browser+ este un motor de #arcurgere s#ecial care evalueaz etic)etele (i coninutul
unui fi(ier <1ML, #e care l afi(eaz n concordan cu #osi!ilitile (i regulile #latformei (i
ca#acitile sale;
c) element+ o com#onent distinctiv a structurii unui document, cum ar fi titlul, un
#aragraf sau o list. "nd ne referim la forma sa a#licat n cadrul unui document, un
element se mai nume(te etic)et (tag);
d) etichet! un cod care identific un element #entru ca !ro-serul sau alt #rogram de
#arcurgere s (tie n ce mod s afi(eze coninutul. 4tic)etele sunt ncadrate de caractere de
delimitare (#aranteze ascuite) 4le sunt ntotdeauna cu#rinse ntre !aran$eze n(hi/are
);<* iar utilizarea literelor mici sau mari n scriere nu au im#ortan.
Documentele <1ML sunt fi(iere text ('0"$$). Rn text sunt inserate o serie de coduri a(a
numitele tag"uri sau marca#e care stau la !aza modurilor de afi(are a documentului. ,n
document <1ML este com#us din tag-uri (i text curat. Documentele au com#onente
asemntoare cum ar fi titluri, ta!ele, liste, #aragrafe etc.
1ag-urile <1ML sunt folosite tocmai #entru a marca elementele comune, care #ot conine
text, grafic sau alte elemente. 1ag-urile sunt de forma : #erec)e nce#ut-sfr(it+
5I
StagT.............................SJtagT
coninut ar!itrar
tagul de sfr(it care are
caracterul slas) (J )
tagul de
nce#ut
0crierea #erec)ilor de legturi+
COREC1 INCOREC1
1a(7ri din cadr/ doc#en$/i %1ML
7iecare document <1ML, nc de la creare are dou #ri #rinci#ale+ un antet (i un cor#.
")iar dac nu sunt s#ecial delimitate, <1ML #resu#une existena lor. <1ML ofer de
asemenea (ansa de a aduga (i alte com#onente funcionale #aginii, su! forma foilor de stil,
scri#turilor (i seturilor de cadre.
De(i fac #arte din definirea unui document <1ML, dou etic)ete exist n afara structurii
documentului+ doctype (i html. %rima identific versiunea de <1ML folosit #entru #agina
res#ectiv (i regulile #e care acestea le res#ect. ' doua etic)et identific un lim!a* glo!al
(i direcia textului #entru documentul res#ectiv, n #lus marc)eaz nce#utul (i sfr(itul
coninutului <1ML.
Documentul <1ML se indic #rin tag-ul <1ML
S<1MLT.........................SJ<1MLT
2om #rezenta numai o #arte din tag-urile <1ML, care sunt im#ortante in realizarea unui
design atragator.
0e considera ca lim!a*ul <1ML este sta#init de catre student, avindu-se in vedere ca au
a!solvit cursul de Tehnici multimedia.
C/ori8 fon$ri8 #ar(ini
6 #agin &e! #oate fi setat #rin+
- alegerea culorii de fond
- alegerea culorii textului (i
- alegerea dimensiunilor #aginii
C/oarea de fond
"uloarea se o!tine din amestecul a celor trei culori fundamentale+ ro(u, verde (i al!astru.
"uloarea de fond a unei #agini &e! se s#ecific utilizand +
5K
Stag5T
Stag?T
SJtag5T
SJtag?T
Stag5T
Stag?T
SJtag?T
SJtag5T
C$%&CT
n#e de c/oare. 'stfel sunt dis#oni!ile cel #uin 5K nume de culori, astfel avem
urmatoarele nume+ red, green, !lue, aEua, !lac., fuc)sia, gra=, lime, maroon,
nav=, olive, #ur#le, silver, teal, -)ite (i =ello-.
secven$a he3azeci#a/a CDrr((&&E unde r,g sau ! sunt cifre )exazecimale (i #ot
lua valorile din multime VB, 5, ?, @, F, I, K, L, M, N, a, ', !, >, c, ", d, D, e, 4, f,
7W;astfel se #ot defini KII@K de culori.
fnc$ia r(&)r8(8&*8 unde r,g si ! iau valori din multimea numerelor naturale
VB,5,?X?IIW
C/oare !en$r $a(7/ &od@
"uloarea unei #agini se #recizeaz #rin intermediul unui atri!ut al etic)ete S!od=T.
0intaxa+
S!od= !gcolor 9 culoareT,
unde culoare se sta!ile(te du# modelul #recizat mai sus.
4xem#lu a unei #agini &e! cu fondul de culoare Gc=anH+
C/oarea $e3$/i
Definirea culorii textului #entru o #agini &e! se face #rin intermediul atri!utului text al
etic)etei S!od=T
0intaxei+
S!od= text 9 culoareT,
unde culoare se #recizeaz la fel ca la exem#lul #recedent.
5L
%agina de &e! urmtoare are textul de culoare ro(ie+
A$ri&$e #/$i!/e
6 etic)eta #oate sa ai!a mai multe atri!ute.
6 etic)eta cu trei attri!ute are urmatoarea sintaxa+
0intaxa+
Setic)eta atri!ut5 9 valoare5 atri!ut? 9 valoare? atri!ut@ 9 valoare@T
4xem#lu+ %agin &e! cu textul de culoare al!astr (i fondul de culoare gal!en+
5M
1e3$/ de &az )&asefon$*
'tri!utele textului de !aza dintr-o #agina &e! sunt+
Mrime (size)
"uloare (color)
7ont (st=le)
0intaxa+
S!asefont size 9 numr color 9 culoare st=le 9 $ont%
unde+
numr #oate lua una dintre valorile din multimea V5, ?, @, F, I, K, L W
(valoarea 5 fiind #entru fontul cel mai mic si valoarea L : #entru fontul cel
mai mare)
culoare se #recizeaz #rin nume sau #rin 83>
$ont #oate fi un font generic din multimea VOserifH, Gsans serifH, HcursiveH, Hmonos#aceH,
Hfantas=H, H1imes /e- 8omanH, G<elveticaH, G'rialH W
0emantica+
4tic)eta (1ag-ul) !asefont este vala!il #n la sfr(itul #aginii sau #n a#are
urmtoarea etic)et S!asefontT.
Rn cazul n care etic)eta S!asefontT li#se(te , textul din #agina &e! are atri!utele #resta!ilite
si anume+
size9@,
color9H!lac.H
st=le9H1imes /e- 8omanH
Mar(ini/e !a(inii We&
0e face cu a*utorul a dou atri!ute ale etic)etei S!od=T+
5N
leftmargin : distana dintre marginea din stnga a ferestrei !ro-serului (i marginea
din stnga a coninutului #aginii
to#margin : distana dintre marginea de sus a ferestrei !ro-serului (i marginea de sus
a coninutului #aginii
2alorile care se #ot atri!uii celor doua atri!ute sunt +
numere ntregi #ozitiv, care indica distana dintre continutul ferestrei si fereastra
!ro-serului, distanta msurat n #ixeli
un #rocent, ce re#rezinta #rocent din limea, res#ectiv, nlimea ferestrei
!ro-serului
S$i/ri/e &/ocri/or de $e3$
S$i/ri fizice
0e #ot alege diferite stiluri #entru caracterele din textul unei #agini &e!.
Carac$ereF Gn(roHa$e )$a(7/ &*8 crsive )$a(7/ i*
,n !loc de text a#are ngro(at n #agin dac este inclus ntre S!T text SJ!T .
?B
,n !loc de text inclus ntre etic)etele SiT text SJiT este scris cu caractere cursive.
Carac$ereF #ri$e )$a(7/ &i(*8 #icsora$e) $a(7/ s#a//*8
,n text inclus ntre etic)etele S!igT text SJ!igT este scris cu caractere mai mari cu o unitate
dect dimensiunea curenta.
?5
,n text inclus ntre etic)etele SsmallT text SJsmallT este scris cu caractere mai mici cu o
unitate dect dimensiunea curente.
Carac$ereFIindice s!eriorE Hi I indice inferiorE
7ragmentele de text aliniate ca indice inferior (su!-scri#t) sunt delimitate de etic)etele Ssu!T
(i SJsu!T.
??
0ecvenele de text aliniate ca indice su#erior (su#er-scri#t) sunt incluse ntre etic)etele Ssu#T
(i SJsu#T.
Carac$ereF s&/inia$e Hi secJiona$e
4tic)eta de ti# !loc SuT text SJuT insereaz un !loc de caractere su!liniate.
4tic)eta Sstri.eT si SJstri.eT sau SsT si SJsT insereaz un !loc de caractere secionate la
mi*loc cu o linie orizontal.
?@
S$i/ri /o(ice
0tilurile logice sunt !azate #e cele fizice. Modul lor de aciune de#inde de !ro-serul utilizat.
B/ocri de carac$ere evidenJia$e
,rmtoarele dou etic)ete #un n eviden #rin stilul cursiv fragmente de text+
SciteT text SJciteT (GciteH 9 citat)
SemT text SJemT (Gem#)asizeH 9 a evidenia)
'ceste dou etic)ete sunt ec)ivalente cu etic)eta SiT XSJiT.
B/ocri de carac$ere #onos!aJia$e
4tic)etele urmatoare #ermit scrierea fragmentelor de text cu caractere monos#aiate de ti#ul
celor utilizate de o ma(in de scris.
ScodeT text SJcodeT (GcodeH 9 cod sau surs)
S.!dT text SJ.!dT (G.e=!oardH 9 tastatur)
SttT text SJttT (Gtelet=#eH 9 tele#rinter)
?F
Confi(rarea fon$ri/or
,n font are urmtoarele atri!ute'
culoarea - se sta!ile(te cu atri!utul GcolorH
ti#ul sau stilul - - se sta!ile(te cu atri!utul GfaceH
mrimea - se sta!ile(te cu GsizeH
mrimea n #uncte ti#ografice (este sta!ilit #rin atri!utul O#oint-sizeH)
grosimea - se define(te cu atri!utul G-eig)tH
C/oarea fon$/i
%entru a scrie un text cu o anumita culoare se ncadreaz acest text ntre delimitatorii
SfontT textSJfontT n felul urmtor+
0intaxa+
Sfont color 9 culoare%text de culoarea s#ecificat SJfontT
?I
0a#i/ia fon$/i
1i#ul de font se sta!ileste #rin atri!utul GfaceH al etic)etei SfontT.
7onturile #ot fi se#arate #rin virgul.
"ele cinci familii generice de fonturi sunt+
serif
sans serif
cursive
monos#ace
fanatas=
%ot fi utilizate si alte fonduri s#ecifice cum ar fi+
1imes (ti# #articular de font serif)
<elvetica (ti# #articular de font sans serif)
'rial
"ourier (ti# #articular de font monos#ace)
&estern (ti# #articular de font fantas=) , etc.
4xem#lu+
Sfont face9H'rial, serif, monos#aceHT.
>ro-serul va utilize #rimul font #e care il recunoaste.
?K
Mri#ea fon$/i
Marimea fontului se indica cu atri!utul GsizeH al etic)etei SfontT.
'cest atri!ut #oate lua urmtoarele valori+
5, ?, @, F, I, K, L (59 cel mai mic font, L9 cel mai mare font);
-5, -?, -@, etc. #entru a mic(ora dimensiunea fontului cu -5, -? X fata de dimensiunea
curenta;
Y5, Y?, Y@, etc. #entru a mri dimensiunea fontului cu Y5,Y?,.. fata de dimensiunea
curenta;
6 alt metod de sta!ilire a mrimii unui font este #rin utilizarea atri!utului O#oint-sizeH al
etic)etei SfontT (i re#rezint mrimea fontului n #uncte ti#ografice. 'cest atri!ut #oate lua
ca si valori orice numar natural #ozitiv.
A$ri&$/ C!oin$ ' sizeE fncJioneaz n#ai c Ne$sca!e Co#nica$or.
?L
Grosi#ea ni fon$
3rosimea #oate fi definit cu cu atri!utul G-eig)tH al etic)etei SfontT.
2alorile #e care le #oate lua atri!utul -eig)t sunt+ 5BB, ?BB, @BB, FBB, IBB, KBB, LBB, MBB (i
NBB (5BB : fontul cel mai su!ire, NBB : fontul cel mai gros)
.................................................................................................................................
B/ocri de $e3$e
a* Inserarea nei adrese
$nserarea unei adrese se face cu a*utorul etic)etei SaddressT X SJaddressT. 1extul
este afi(at cu caractere cursive.
?M
&* Inden$area ni &/oc de $e3$
,n !loc de text indentat este un !loc de text la care marginea din stnga a textului
este de#lasat la o anumit distan de marginea #aginii.
B/ocri ;div<
Delimitarea (i formatarea unui !loc de text se face cu delimitatorii SdivT textSJdivT.
>locul SdivT are urmatoarele atri!ute +
Ca/i(nE )a/iniere*.
2alorile atri!utului GalignH sunt+
GleftH : aliniere la stnga
GcenterH : aliniere central
?N
Grig)tH : aliniere la drea#ta
>locul SdivTtext SJdivT are #osi!ilitatea sa includa si alte su!!locuri.
'tri!utul GalignH are efect asu#ra tuturor su!!locurilor incluse in !locul SdivT.
Cno+ra!E care #ermite intreru#erea randurilor acolo unde este #recizat acest lucru.
B/oc/ !refor#a$a$
4tic)etele S#reT X SJ#reT #ermit #astrarea caracteristicilor textului asa cum a fost introdus
in fisier, deci ia in considerare caracterele Gs#aiuH, Gta!H (i G"8JL7H (enter la sfarsit de
linie).
>locul S#reT ... SJ#reT #oate fi folosit #entru a insera randuri vide.
"aracterul s#atiu, #entru a #utea fi luat n considerare tre!uie #recizat #rin OZn!s#H.
@B
B/ocri !ara(raf )$a(7/ ;!<*
1recerea la o linie noua se face cu etic)eta S!rT, (!r de la !rea.9#auz).
La fel si etic)eta S#T face trecerea la o linie nou, dar etic)eta S#T #ermite+
inserarea unui s#aiu su#limentar inainte de !locul #aragraf.
inserarea unui s#aiu su#limentar du#a !locul #aragra#);.
alinierea textului cu a*utorul atri!utului GalignH, cu valorile GleftH, GcenterH sau
Grig)tH
@5
B/ocri de $i$/
1itlurile ()eaders) de ca#itole sau #aragrafe #ot avea diferite dimensiuni. 4le #ot fi introduce
cu tag-ul S)xT text SJ)xT unde x #oate lua valori din multimea V5,?,@,F,I,KW
4xem#lu+
S)@TX(!loc de text)XSJ)@T
0e acce#t atri!utul align de ctre aceste etic)ete #entru alinierea titlului !locului de text la
stnga (modul #resta!ilit), n centru (i la drea#ta.
1ag-ul S)5T scrie titlul cu caracterele cele mai mari (i cele mai ngro(ate.
1ag-ul S)KT folose(te caracterele cele mai mici.
Linii orizon$a/e
0e #ot insera linii orizontale intr-o #agina -e! cu a*utorul etic)etei S)rT.
Confi(rarea nei /inii orizon$a/e
'tri!ute ale etic)etei S)rT sunt+
GalignH - #ermite alinierea. 2alori #osi!ile+ GleftH, GcenterH, Grig)tH.
@?
G-idt)H - #ermite alegerea lungimii liniei. 2alori #osi!ile+
numere ntregi #ozitive care re#rezint lungimea liniei, n
#ixeli;
numere ntre 5 (i 5BB urmate de semnul [; re#rezint #rocentul
din limea #aginii #e care se ntinde linia;
GsizeH : #ermite alegerea grosimii liniei. 2alorile #osi!ile sunt numere ntregi
#ozitive re#rezentnd grosimea liniei n #ixeli (valoarea #resta!ilit este G?H);
Onos)adeH : define(te o linie fr um!r;
GcolorH : #ermite definirea culorii liniei
1a&e/e
,n ta!le se insereaz ntre etic)etele ;$a&/e< Hi ;=$a&/e<.
%entru inserarea unui rnd ntr-un ta!el se folosesc etic)etele ;$r< Hi ;=$r< (tr 9 Gta!le ro-H)
"oloanele sunt introduce #e rand #e cite-o linie cu tag-ul ;$d<. si ;=$d< ( td 9 Gta!le dataH).
")enarul unui ta!le se introduce cu atri!utul !order din tag-ul ta!le. $n mod im#licit un ta!el
nu are c)enar. 1itlul unui ta!le se introduce cu tag-ul ;ca!$ion< $e3$ ;=ca!$ion<.
'tri!ute im#ortante ale tag-ului Sta!leT, astfel #entru a +
alinia un ta!le se foloseste atri!utul a/i(n cu valorile #osi!ile+ GleftH (valoarea
#resta!ilit), GcenterH (i Grig)tH.
adauga c)enar unui ta!el se utilizeaz a$ri&$/ C&orderE care ia ca valoare orice
numr ntreg (inclusiv zero) (i re#rezint grosimea n #ixeli a c)enarului ta!elului.
O&serva$iiF
2aloarea #resta!ilit a grosimii c)enarului ta!elului este de 5 #ixel.
Dac valoarea grosimii c)enarului este egal cu B, atunci nu avem c)enar.
")enarul are un as#ect tridimensional.
Ca$eva e3e#!/e de creare a nor $a&e/eF
,n ta!el fara c)enar
@@
5n $a&e/ c chenar
@F
A/inierea $a&e//i in !a(ina de We&
@I
"recizarea c/ori/or de fond !en$r n $a&e/
"uloarea de fond se sta!ileste cu atri!utul G!gcolorH.
"uloarea de fond #oate fi ata(at ntregului ta!el #rin etic)eta Sta!leT.
"uloarea de fond #oate fi ata(at unei linii de ta!el #rin etic)eta StrT.
"uloarea de fond #oate fi ata(at unei celule de ta!el #rin etic)eta StdT.
A$en$ieF
Daca avem definite mai multe atri!ute !gcolor, se vor lua in considerare in ordinea + StdT,
StrT, Sta!leT. 1ag-ul Sta!leT are #rioritatea cea mai mica.
"uloarea textului din fiecare celula se indica in tag-ul S font T text SJfontT
Sfont color9HvaloareHTXSJfontT
@K
Dimensionarea celulelor unui ta!el
Distana dintre dou celule vecine se define(te cu a*utorul atri!utului Gcells#acingH al
etic)etei Ota!leH. 2alorile lui Ocells#acingH #ot fi numere ntregi #ozitive, inclusiv B.
2aloarea #resta!ilit este ?.
Distana dintre marginea unei celule (i coninutul ei se definie(te cu atri!utul Gcell#addingH
al etic)etei Sta!leT. 2alorile lui Ocell#addingH #ot fi numere ntregi #ozitive. 2aloarea
#resta!ilit este 5.
@L
@M
Di#ensionarea ni $a&e/
Dimensiunile unui ta!el : limea (i nlimea : se sta!ilesc cu atri!utele G-idt)H, G)eig)tH
ale etic)etei Sta!leT.
'ceste atri!ute #ot lua valorile+
numere intregi #ozitive, re#rezint limea, res#ectiv nlimea n #ixeli a ta!elului.
numere ntregi ntre 5 (i 5BB, urmate de semnul [, re#rezint o fraciune din limea,
res#ectiv nlimea, total a #aginii.
I#a(ini
7ormatele acce#tate de !ro-sere #entru fi(ierele de imagini sunt+
3$7 (3ra#)ics $nterc)ange 7ormat) : extensia .gif
D%43 (Doint %)otogra#)ic 4x#erts 3rou#) cu extensia .*#eg sau .*#g
>M% (>itMa#) cu extensia .!m# (este ntlnit numai cu !ro-serul $nternet
4x#lorer, etc.
$nserarea ntr-o #agin &e! a unei imagine se face utilizand etic)eta SimgT cu atri!utul
GsrcH, iar valoarea acestui atri!ut este adresa ,8L a imaginii.
Dac se dore(te adugarea unui c)enar n *urul imaginii se folose(te atri!utul !order al
etic)etei SimgT care #oate lua valori numere ntregi #ozitive.
Dimensiunile unei imagini #ot fi modificate #rin intermediul atri!utelor G-idt)H (i G)eig)tH
ale etic)etei SimgT.
@N
'cestea #ot avea ca si valori +
numere ntregi #ositive ce re#rezint numrul de #ixeli
numere de la 5 la 5BB urmate de [, re#rezint #rocente din limea, res#ectiv din
nlimea !locului n care se afl imaginea.
%recizarea dimensiunilor s#aiului ocu#at de o imagine duce la la cre(terea vitezei de
ncrcare a #aginii.
A/inierea nei i#a(ini Gn !a(ina We&
'linierea se face #rin intermediul atri!utului GalignH al etic)etei SimgT, care ia valorile+
GleftH : aliniere la stnga
Grig)tH : aliniere la drea#ta
Gto#H : aliniere deasu#ra .%artea de sus a imaginii se aliniaz cu #artea de sus a
textului ce #recede imaginea.
GmiddleH : aliniere la mi*loc
G!ottomH sau G!aselineH : aliniere la !az
FB
A/inierea $e3$/i Gn 6r/ nei i#a(ini
0e face cu atri!utele G)s#aceH (i Gvs#aceH ale etic)etei SimgT care #recizeaz distana n
#ixeli #e orizontal (i #e vertical, dintre imagine si elementele din #agin.
F5
F?
I#a(inea !en$r fond/ nei !a(ini We&
0e #oate folosi imaginea #entru a sta!ili fondul unei #agini &e! cu a*utorul atri!utului
G!ac.groundH al etic)etei S!od=T care ia ca valoare adresa ,8L a imaginii.
I#a(ini ca /e(a$ri
$maginea tre!uie sa a#ara ca element de legatura in cadrul tagulul SaT imagine SJaT
F@
Le(a$ri)LinK7ri*
"u a*utorul legturilor, un text o!i(nuit se transform n )i#ertext sau )i#ermedia.
Legturile sunt zone active ntr-o #agin &e!.
%aginile &e! sunt interactive deoarece au un rs#uns la aciunile care sunt iniiate de cei care
le utilizeaz.
Legturile n #agina )tml se insereaz cu a*utorul etic)etei s#eciale SaT (i a atri!utului O)refH
care ia ca valoare adresa ,8L a resursei solicitate.
"nd mouse-ul este deasu#ra unei zone active, el ia forma unei mini. "alculatorul client
ex#ediaz cererea , #rime(te resursa #e care a solicitat-o #e care o va ncrca n !ro-ser.
Rn acela(i !ro-ser, #agina nou va fi nlocuit de cea vec)e.
A/e(erea Gn$re do !a(ini
FF
LinK ca$re n si$e
Le($r c$re o ancor din ace/aHi doc#en$.
FI
'cest lucru se realizeaza utilizand #erec)ea de tag-uri+
Sa )ref9H\etic)etaHT 0'L1 SJaT
Sa name 9 GeticT '$"$ am facut 0'L1SJaT
FK
Ancor af/a$ Gn a/$ doc#en$
O !a(in no Gn$r7o fereas$r no
FL
S$a&i/irea c/ori/or !en$r /e($ri
0e utilizeaz trei culori #entru legturi+
o culoare #entru legturile nevizitate
o culoare #entru legturile vizitate
o culoare #entru legturile active
'cestea se sta!ilesc cu atri!utele+
Hlin.H #entru legaturile nevizitate
Ovlin.H #entru legaturile vizitate
Oalin.H #entru legaturile active
0or#/are
Des!re for#/are
7ormularele <1ML sunt cele mai frecvent utilizate #entru a colecta informaii de la #ersoane
care viziteaz site-ul. ,n formular este un ansam!lu de zone active alcatuite din !utoane de
a#asat, casete de selectie, cam#uri de editare si altele.
6 sesiune de lucru cu cu o #agina &e! ce contine un formular cu#rinde urmatoarele eta#e+
5. 0e com#leteaza formularul care se transmite unui server;
?. 6 a#licatie dedicata de #e server analizeaza formularul com#letatsi eventual se
stoc)eaza datele intr-o !aza de date.
@. 4ventual serverul ex#ediaza un ras#uns utilizatorului.
1a(7/ ;for# <
,n formular este delimitat de tag-ul ;formT....descriere formular...SJformT.
Rntre tag-ul de intrare (i cel de ie(ire sunt inserate, n #rinci#al controalele formularului.
%rinci#alele atri!ute ale tag-ului form sunt+
action
FM
met)od
enct=#e
target
7orm-ul are ? atri!ute im#ortante+ action si met)od.
0intaxa+
Sform action 9 valoareCa met)od 9 valoareCmT XXSJformT
unde+
- valoareCa #oate lua ca si valoare+
adresa ,8L a unui adresa ,8L a unui scri#t aflat #e server, care #rimeste datele
formularului , se face o #relucrare a datelor si ex#ediaza un ras#uns utilizatorului
daca e cazul
adresa de mail , caz in care datele formularului sunt transmise#rin #osta
electronica
4xem#lu! action & '---XJXH
]
0cri#t
4xem#lu+ action 9 Gmailto+ livia.sangeorzan^=a)oo.comH
7 valoareCm #oate lua ? valori+
get este valoare im#licita(datele din formular se adauga la adresa ,8L s#ecifcata
in action);
#ost (datele sunt ex#ediate se#arat; se foloseste cand sunt transmise cantitati mari
de date ).
1a(7/ ;in!$<F
%entru a crea diferite !utoane sau casete se foloseste tag-ul Sin#utT
0intaxa+
Sin#ut t=#e 9 name 9 value 9 T
unde
t=#e #oate lua valorile urmatoare
text
radio ( atri!utul c)ec.ed selecteaza la #rima activare a #aginii
!utonul);
c)ec.!ox;
su!mit : trimite
reset : sterge (reseteaza);
#ass-ord : #arola (cand scriem se vad asterixuri, dar la
server(destinatar)se vede totusi #arola decodificata).
name este numele atasat casetei sau !utonului . /u re#rezinta continutul !utonului
sau casetei. continutul
value ce a#are scris #e !uton sau continutul castei sau in cazul !utoanelor radio
numele !utoanelor care fac #arte din aceiasi familie.(continutul);
FN
'lte atri!ute ale tag-ului in#ut+ -size - s#ecifica latimea cam#ului de editare;
7maxleng)t - s#ecifica maximul de caractere.
Daca intr-un in#ut li#seste atri!utul t=#e, rezulta im#licit t=#e 9 text.
Lim!a*ul Dava0cri#t va recunoaste !utoanele du#a name.
Lis$e de se/ec$ie ;se/ec$< ;o!$ion <L. ;=se/ec$<
6 lista de selectie #ermite alegerea unuia sau mai multor elemente dintr-o lista finita.
're ? atri!ute im#ortante + name si size.
4lementele dintr-o lista se introduc cu tag-ul So#tionT.
0intaxa+
Sselect name 9 nume size 9 numarT
So#tion value 9 valoareC5 selectedT 4lementC5
So#tion value 9 valoareC? T 4lementC?.
So#tion value 9 valoareC@T 4lementC@
SJselectT.
unde+
name - numele listei de selectie
size - este un numar intreg #ozitiv, #recizeaza cate elemente din lista sunt
vizi!ile la un moment dat
So#tion T este tag-ul care include elementele listei. 0erver-ul #rimeste #erec)ea
"ontinutul din value si valoarea du#a o#tion
selected #ermite selectarea #resta!ilita a unui element al listei
IB
Lis$a de se/ec$ie c se/ec$ii #/$i!/e
're aceiasi sintaxa cu lista de selectie descrisa mai sus, dar in #lus are atri!utul multi#le in
tag-ul select.
Ca#!ri de edi$are #/$i!/e
0e fac cu tag-ul Stextarea T
0intaxa+
Stextarea liste de atri!ute< text SJtextareaT
Din lista de atri!ute enumeram+
co/s (nr de caractere afisate intr-o linie),
ro+s (nr de linii afisate simultan),
na#e (#ermite atasarea unui nume),
+ra! care determina com#ortamentul cam#ului de editare fata de sfarsitul de
linie. 'tri!utul #oate lua valorile+ off, )ard, soft..
I5
Rntre tag-ul de intrare (i cel de ie(ire ale formularului sunt inserate, n #rinci#al, controalele
formularului. ,n control este o form de interaciune a utilizatorului cu formularul. %utem
#rezenta conform ta!elului de mai *os #rinci#alele controale ntr-un formular <1ML
#rezentate mai sus+
CON1ROL ACMI5NE A 51ILIZA1OR5L5I 1AG
text $ntroducere a unui text de volum redus $n#ut
#ass-ord $ntroducere a unui text de volum redus, care a#are, #e ecran,
mascat cu N
$n#ut
su!mit 'ctivare (#entru a transmite informaiile com#letate de
utilizator)
$n#ut
reset 'ctivare (#entru a resta!ili valorile iniiale ale tuturor
controalelor formularului)
$n#ut
c)ec.!ox >ifare $n#ut
radio >ifare $n#ut
textarea $ntroducere a unui volum mare de text 1extarea
menu 'legere a unei o#iuni dintr-un meniu 0elect o#tion
I?
%ar$i de i#a(ini
6 imagine #oate fi folosita ca si zona activa. $n acest caz imaginea se insereaza in
documentul <1ML intre etic)etele SaT si SJaT.
4xista insa #osi!ilitatea de a crea )arti de imagini (Oimage ma#sH) care #ermite ca diferite
zone ale unei imagini sa fie definite dre#t legaturi catre diverse #agini &4>.
"rearea unei )arti de imagini #resu#une trei eta#e+
Definirea unei imagini ca )arta de imagini. 0e v a utiliza tag-ul ;i#(< cu atri!utele
src si se#a!. /umele dat #ozei in usema#, #recedat de semnul\, se va regasi
o!ligatoriu in tag-ul ma#, in atri!utul name..
Definirea )artii in interiorul unui !loc s#ecial definit cu tag-ul ;#a!< si ;=#a!<.
1ag-ul are un atri!ut o!ligatoriu si anume Ina#eE8 care #rimeste ca si valoare
numele )artii ( numele din usema#);
"rearea zonelor #e )arta. 7iecare zona se introduce cu etic)eta ;area<.
4tic)eta SareaT are trei atri!ute o!ligatorii+
5. Os)a#eH care #oate lua una din valorile+
OrectH (#entru zone de forma dre#tung)iulare);
OcircleH (#entru zone de forma circulara);
O#ol=H (#entru zone de forma #oligonala);
defaultH (#entru #ortiunile imaginii care nu se incadreaza in nici
una dintre categoriile anterioare)
?. OcoordsH determina coordonatele zonei
@. )ref #rimeste adresa ,8L a #aginii indicate de legatura zonei
res#ective.
2alorile atri!utului Os)a#eH+
rect coords9Hx5,=5,x?,=?H : dre#tung)i unde (x5, =5) este coordonata coltului
stanga sus si (x?, =?) este coordonata coltului drea#ta *os.
circle coords9Hx5, =5,rH : (x5,=5) este centrul cercului de raza r.
%ol= coords9Hx5,=5,x?,=?,...xn,=nH : #oligonul cu varfurile de coordonate
(x5,=5), (x?,=?), (x@,=@),....
%entru o!tinerea automata a coordonatelor se #oate folosi #rogramul M'% 1)is, #rogram
care defineste regulile #entru o imagine .gif sau .*#eg. %rogramul este free-are si se #oate
descarca de #e $nternet.
I@
Eveni#en$e/e IonfocsE si Ion&/rE
6 #agina #oate contine mai multe elemente #rin care #utem introduce date. Daca introducem
un sir de caractere intr-un cam# de editare s#unem ca res#ectivul element #rimeste focusu-l.
4venimentul onfocs are loc atunci cand un element #rimeste focus-ul;
4venimentul on&/r are loc cand elementul #ierde focusul.
4lementele care #rimesc focus-ul au doua metode im#ortante+
metoda onfocs)* atri!uie focus-ul elementului
metoda on&/r)* face ca elementul sa #iarda focusul.
4xem#lu +$ntr-o caseta tre!uie sa se introduca un text, in cazul in care se face clic., fara a
introduce ceva, a#are un mesa*, #rin care se cere reintroducerea unei valori. /u #utem #leca
masi de#arte #ina cand nu am introdus ceva.
IF
II
%eg"li C(( ( )oi de stil in cascada#
"00 este un acronim #entru "ascading 0t=le 0)eets (foi de stil n cascad). "00 este utilizat
la m!untirea #rezentrii unei #agini &e! (adic a modului n care !ro-ser-ul o afi(eaz).
"00 #ermite sta!ilirea #ro#rietilor #entru elementele <1ML utiliznd o gam uria( de
valori. 'vnd la dis#oziie mai mult de 5BB de #ro#rieti, "00 este un instrument avansat
destinat #roiectanilor &e! #entru crearea de site-uri #rofesionale, care nu #ot fi construite
folosind atri!ute <1ML o!i(nuite. $n "00 exista #osi!ilitatea sa se aseze elementele in
#ozitiile dorite (alta decat cea in cazul fluxului normal).
$n mod normal definitiile stilurilor sunt introduce in Gfoi de stilH (st=le s)eet).
0tilurile au fost introduce in versiunea <1ML F.B.
4xista doua modalitati de a defini un stil #rin+
sintaxa "00 ("ascading 0t=le 0)eets);
sintaxa lim!a*ului Dava0cri#t.
,na din caracteristicile fundamentale ale "00 este fa#tul c_ autorul #oate ata(a un stil, iar
cititorul #aginii res#ective #oate ata(a altul, deci se o!ine un set de reguli n cascada. $n
acest caz exist_ un set de reguli de #rioritate care va decide care regul_ se va a#lica.
4xista F ti#uri de stiluri "00.
6rdinea de utilizare a stilurilor este urmatoarea+
5 stilul im#licit al navigatorului (!ro-ser default);
? foi de stil externe (4xternal st=le s)eets);
@ foile de stil interne ( din interirul elementului )ead)
F stiluri s#ecificate in marca*ul de start al unui element <1ML (inline st=le).
(tr"ct"ra "nei reg"li C((
6 regul_ este format_ din dou_ #_ri #rinci#ale+ selectorul (i declaraia.
Declaraia se afla intre elementul GVG si elemental G WH, la rndul ei, declaratia este format_
tot din dou_ #_ri+ #ro#rietatea (i valoarea.
<5 V color+ !lue W
Rn exem#lul anterior <5 este selectorul, V color+ !lue W declaraia cu #ro#rietatea color (i
valoarea !lue.
Rn !locul Sst=leT...SJst=leT avem regulile "00 definite ca mai sus.
Deci definim mai nti, clasa de stiluri n interiorul !locului Sst=leTXSJst=leT care se #oate
afl n !locul S)eadT...SJ)eadT.
Integrarea reg"lilor C(( *ntr+"n ,iier HTML
S<1MLT
S1$1L4T 4xem#lu SJ1$1L4T
S01`L4 1`%49HtextJcssHT
<5 V color+ green W
SJ01`L4T
S>6D`T
S<5T 'cest )eading este verde datorit_ unei reguli "00 SJ<5T
SJ>6D`T
IK
SJ<1MLT
$n exem#lul anterior regula "00 este s#ecificat_ n interiorul fi(ierului <1ML. %rin aceast_
metod_ modificrile n cazul fi(ierelor mari devin greoaie de aceea se recomand_ scrierea
regulilor ntr-un fi(ier se#arat de unde s_ fie im#ortate n fi(ierul <1ML. %entru
exem#lificare edit_m un fi(ier #e care l denumim Oreguli.cssH. $n acest fi(ier scriem <5
V color+ green W.Documentul <1ML care im#ort_ acest regulile din acest fi(ier este de forma
urm_toare+
S<1MLT
S1$1L4T 4xem#lu de im#ort SJ1$1L4T
SL$/a 84L9Hst=les)eetH <8479Hc+breguli.cssH 1`%49HtextJcssHT
S>6D`T
S<5T 'cest )eading este verde datorit_ unei reguli im#ortate SJ<5T
SJ>6D`T
SJ<1MLT
-r"parea selectorilor i a declaraiilor
%entru a reduce dimensiunea fi(ierelor selectorii se #ot gru#a, se#ararea lor fcndu-se #rin
virgul_.
<5, <?, <@, % V font-famil=+ )elvetica W
'semntor se #ot gru#a (i declaraiile+
<5 V
font--eig)t+ !old;
font-size+ 5?#t;
line-)eig)t+ 5F#t;
font-famil=+ )elvetica;
font-variant+ normal;
font-st=le+ normal;
W
C/ass ca selector
6 regul_ de genul <5 V color+ !lue W se a#lic_ mereu cnd a#are selectorul <5 indiferent dac_
vrem sau nu. %entru a evita acest lucru se folosesc clasele.
7ie fi(ierul reguli.css, fi(ierul n care scriem regulile #e care le vom im#orta.
0intaxa #entru definirea unei clase este urmtoarea+ <5.clasaCnoastr_ V color+ red W
$n fi(ierul <1ML cnd vrem s_ a#lic_m regula res#ectiv_ scriem
S<5 "L'009HclasaCnoastr_HT <eading ro(u SJ<5T.
Dac_ am scrie S<5T <eading o!i(nuit SJ<5T nu se va mai a#lica regula "00, deci textul
O<eading o!i(nuitH nu va mai a#are ro(u.
"lasa definit_ mai sus se #oate a#lica numai #entru <5.
Dac_ am avea S% "L'009HclasaCnoastr_H nu se o!ine nici un efect. 1otu(i se #ot defini
clase generale astfel+ .clasaCdoi V color+ !lue W. 6 astfel de clasa #oate fi a#licat_ oricrui
selector care su#ort_ s#ecificarea unei culori.
IL
ID ca se/ec$or
6 construcie asemntoare cu "L'00 este $D.
Sin$a3a !en$r definirea ni e/e#en$ ID es$e "r./toareaF
<5\zNM= V letter-s#acing+ B.Iem W.
,n astfel de $D se #oate a#lica numai #entru <5 n felul urmtor+
S<5 $D9zNM=T&ide textSJ<5T.
%entru definirea unui $D care s_ #oat fi a#licat oricrui selector declaraia se face astfel+
\zNM= V letter-s#acing+ B.@em W.'cest $D #oate fi a#licat oricrui selector care su#ort_
s#ecificarea dimensiunii dintre litere.
Co#en$arii
"omentariile sunt asemntoare cu cele din lim!a*ul de #rogramare ".
4M V color+ lime W Jc un verde s_ te doar oc)ii cJ
"sedo7c/ase Hi !sedo7e/e#en$e
'u fost introduse #entru adugarea unor facilit_i su#limentare de formatare. %seudo-clasele
(i #seudo-elementele sunt recunoscute n cadrul regulilor "00, dar nu sunt recunoscute direct
n fi(ierul <1ML.
"sedo7c/asa anchor
'ceast_ #seudo-clas_ #ermite formatarea lin.-urilor din cadrul unui #agini -e!.
'+lin. V color+ red W Jc lin. nevizitat cJ
'+visited V color+ !lue W Jc lin. vizitat cJ
'+active V color+ lime W Jc lin. activ cJ
%rin aceste reguli toate lin.-urile din #agina <1ML vor lua culorile s#ecificate. %seudo-clasa
anc)or nu are efect dect asu#ra selectorului ', de aceea regula+ '+lin. V color+ red W are
acela(i efect ca (i +lin. V color+ red W.De asemenea #seudo-clasele #ot fi com!inate cu clasele
o!i(nuite astfel+ '.clasaCmea+lin. V color+ red W.
"sedo7e/e#en$e
firs$7/ine
%ermite s#ecificarea unui anumit stil #entru #rima linie dintr-un #aragraf.
S01`L4 1`%49textJcssT
%+first-line V font-variant+ small-ca#s W
SJ01`L4T
S%T1)e first line of an article in /e-s-ee..
%resu#unnd ca #rima linie se termin_ du#_ cuvntul OanH n #agina -e! acest text va a#are
su! forma+
IM
1<4 7$801 L$/4 67 '/
article in /e-s-ee..
firs$7/e$$er
'sem_n_tor cu first-line acest #seudo-element #ermite s#ecificarea unui stil #entru #rima
liter_ dintr-un text.
"recedenJa re(/i/or
De multe ori se ntm#l_ ca ntr-un #unct n cadrul unui fi(ier <1ML s_ fie vala!ile mai
multe reguli "00.%entru a rezolva astfel de situaii tre!uie sta!ilite ni(te reguli de #rioritate.
Oi#!or$an$O
d$m#ortantd este un cuvnt rezervat #rin care i se d_ unei reguli "00 o #rioritate mai mare
dect unei reguli o!i(nuite.
% V font-size+ 5?#t e im#ortant; font-st=le+ italic W
8eguli+
5. 8egula care conine de im#ortantd su#rascrie o regul_ o!i(nuit_.
?. 0#ecificitatea unui selector+ selectorii mai s#ecifici i su#rascriu #e cei mai generali.
0#ecificitatea se o!ine #rin concatenarea a trei numere+ num_rul de atri!ute $D din
cadrul selectorului (a), num_rul de atri!ute "L'00 (!) (i num_rul de tag-uri din
selector (c).
L$ V...W Jc a9B !9B c95 -T s#ecificitate 9 5 cJ
,L L$ V...W Jc a9B !9B c9? -T s#ecificitate 9 ? cJ
,L 6L L$ V...W Jc a9B !9B c9@ -T s#ecificitate 9 @ cJ
L$.red V...W Jc a9B !95 c95 -T s#ecificitate 9 55 cJ
,L 6L L$.red V...W Jc a9B !95 c9@ -T s#ecificitate 9 5@ cJ
\x@F= V...W Jc a95 !9B c9B -T s#ecificitate 9 5BB cJ
%seudo-clasele sunt num_rate ca (i clasele o!i(nuite, iar #seudo-elementele sunt num_rate ca
(i elementele o!i(nuite.
@. Rn cazul n care dou_ reguli a*ung s_ ai!_ acea(i s#ecificitate se a#lic_ regula
s#ecificat_ mai trziu.8egulile im#ortate se consider_ a fi naintea oric_rei reguli din
fi(ierul n care sunt im#ortate.
(til"ri in+line
0unt definite n etic)eta n care dorim s se a#lice aceste stiluri.
2aloarea lui Sst=le 9 GvaloareHT este cu#rins ntre g)ilimele.
(til"ri de,inite *n ,iiere eterne
0tilurile definite n interiorul !locului Sst=leTXSJst=leT #ot fi scrise ntr-un fi(ier extern,
#entru a #utea fi utilizate n mai multe fi(iere <1ML.
0e creeaz un fi(ier care conine descrierea stilurilor (i se salveaz cu extensia .css sau .html
Rn fi(ierul <1ML care utilizeaz stilurile se include n !locul S)eadTXSJ)eadT o etic)et
Slin.T cu atri!utele+
OrelH cu valoarea st=les)eet
O)refH cu valoarea adresa ,8L a fi(ierului creat , care contine regulile css.
IN
0trib"te C((
0on$
font-famil= 2aloarea+ nume de font. 4xem#le+ )elvetica, serif, sans-serif, cursive,
monos#ace, fantas=, etc
>6D` V font-famil=+ gill, )elvetica, sans-serif W
font-st=le 2aloarea+ normal f italic f o!liEue
font-variant 2aloarea+ normal f small-ca#s
font--eig)t 2aloarea+ normal f !old f !older f lig)ter f 5BB f ?BB f @BB f FBB f IBB f
KBB f LBB f MBB f NBB. 2aloarea+ normal ec)ivaleaz_ cu FBB, iar !old cu LBB.
font-size 2aloarea+ Sa!solute-sizeTfSrelative-sizeTfSlengt)TfS#ercentageT
Sa!solute-sizeT #oate lua una din valorile+ xx-small f x-small f small f medium f large f
x-large f xx-large
Srelative-sizeT #oate lua una din valorile+ larger sau smaller
S#ercentageT
4xem#le
% V font-size+ 5?B[ W
<5, <?, <@ V font-st=le+ italic W
Dimensiunile #entru font-size sunt s#ecificat_ #rin+
5. mrime a!solut, avem urmatoarele valori #osi!ile+
xx-small
x-small
small
medium (valoarea #resta!ilit)
large
x-large
xx-large
?. mrime relativ fa de valoarea curent, avem urmatoarele valori #osi!ile+
larger
smaller
@. numar ntreg urmat de unitatea de msur
F. #rocente din valoarea curent.
4xem#lu+
% Vfont-size+ N#x W
Dimensiunea fontului #oate fi s#ecificat_ n centimetri(cm), milimetri(mm), #ixeli(#x),
oli(in), #uncte(#t 5#t95JL?in), etc.
- in>PQ !$>Q.R9 c#>S !c
KB
BacK(rond Hi c/oare
color 2aloarea culorii #oate fi s#ecificat_ #rin 83>(ro(u,verde,al!astru), #arametrii
lund valori ntre B (i ?II, #rin numele unei culori care este de*a definit_
(!lue,green,!lac., etc) sau #rin \nr5nr?nr@. /r5,nr?,nr@ sunt numere de dou_ cifre n
!aza 5K.
<? V color+ rg!(?II,B,B) W <@ V color+ \BB77K' W
!ac.ground-color 2aloarea+ ScolorT f trans#arent.
!ac.ground-image 2aloarea+ SurlT f none
!ac.ground-re#eat 2aloarea+ re#eat f re#eat-x f re#eat-= f no-re#eat %recizeaz_ dac_
imaginea din fundal este re#etat_ sau nu.%entru valoarea Ore#eatH imaginea este
multi#licat_ #e orizontal_ (i vertical_.%entru valoarea Ore#eat-xH imaginea este
multi#licat_ numai #e orizontal_,iar #entru Ore#eat-=H imaginea este multi#licat_ doar
#e vertical_.
!ac.ground-attac)ment 2aloarea+ scroll f fixed 0#ecific_ dac_ imaginea din fundal
este derulat_ odat_ cu coninutul sau nu.
1e3$
-ord-s#acing 2aloarea+ normal f Sleng)tT (dimensiunea dintre cuvinte)
letter-s#acing 2aloarea+ normal f Sleng)tT (dimensiunea dintre litere)
text-decoration %oate lua una din valorile+ underline, overline, line-t)roug), !lin..
vertical-align 2aloarea+ !aseline f su! f su#er f to# f text-to# f middle f !ottom f text-
!ottom f S#ercentageT
text-transform 2aloarea+ ca#italize f u##ercase f lo-ercase f none
text-align 2aloarea+ left, rig)t, center, *ustif=
Dis$anJa din$re rTndri
0e folose(te atri!utul Gline-)eig)tH. 2alori #osi!ile+
valoarea GnormalH
factor de scal
#rin lungime
#rin #rocente din valoarea curent a fontului
S$i/ri !en$r diferi$e #edii
0e stie ca un text afisat #e monitor cu culoarea gal!ena se vede foarte sla! cand este ti#arit la
o im#rimanta al!-negru. 'ceasta deficienta #oate fi corectata daca se utilizeaza stiluri
#otrivite #entru fiecare mediu. Mediul #entru care este vala!il un stil este s#ecificat #rin
atri!utul media al elementului Sst=leT, care #oate lua urmatoarele valori #osi!ile+
GscreenH (#entru monitoare)
G#rintH (#entru im#rimante)
G#ro*ectionH (#entru #roiectoare video)
G!railleH (#entru terminale destinate nevazatorilor)
Gs#eec)H (#entru terminale audio)
GallH (#entru toate ti#urile de medii)
4xem#lu
K5
S)tmlTS)eadTStitleT 4xem#lu M4D$'SJtitleT
Sst=le t=#e-GtextJcssH media9HscreenHT
# Vcolor+ =ello-;W
SJst=leT
Sst=le t=#e9HtextJcssH media9H#rintHT
# Vcolor+ !lac.;W
SJst=leT
SJ)eadTS!od=T
S#T 'cest #aragraf va avea culoarea gal!ena #e monitor si culoarea neagra la
im#rimare.
SJ!od=TSJ)tmlT
Confi(rarea &/ocri/or de $e3$
Di#ensini/e ni &/oc+
,n !loc este format din+
coninut
distana dintre coninut (i c)enar
c)enar
margini
Mar(ini/e &/oc/i
Marginile unui !loc re#rezinta distanta minima dintre c)enarele a doua !locuri vecine. %entru
a sta!li marginile unui !loc se utilizeaza atri!utul+
margin-left
margin-rig)t
margin-to#
margin-!ottom
margin.
Daca sunt indicate valori se#arate #rin s#atiu acestea re#rezinta dimensiunile in ordinea
urmatoare+ sus, drea#ta, *os, stanga.
Dimensiunile care li#sesc #reiau valorile de la elementele o#use.
Daca este data o singura valoare aceasta va fi folosita #entru toate directiile.
2alorile#osi!ile ale acestor atri!ute sunt+
GautoH
marime(numar urmat de o unitate de masura)
#rocent din latimea #aginii(numar intreg intre B si 5BB, urmat de sim!olul[)
6!servatii+ 2alorile mentionate anterior #ot fi si negative
Dis$anJa din$re conJin$ Hi chenar
"u a*utorul atri!utelor de mai *os se sta!ileste distanta dintre continutul unui !loc(text,
imagini, etc) si c)enarul acestuia .
'tri!ute+
#adding-to#
#adding-rig)t
#adding-!ottom
#adding-left
#adding
K?
Ua/ori !osi&i/e a/e a$ri&$e/or sn$+
Mrimea (numr ntreg #ozitiv)
%rocent din limea #aginii
LJi#ea chenar/i
'tri!ute+
>order-to#--idt)
>order-rig)t--idt)
>order-!ottom--idt)
>order-left--idt)
>order--idt)
2alori #osi!ile+
Gt)inH, GmediumH sau Gt)ic.H
/umere ntregi #ozitive urmate de o unitate de msur
S$i// chenar/i
"u a*utorul atri!utului G!order-st=leH.
2alori #osi!ile+
GnoneH (valoarea #resta!ilit)
GsolidH (continuu)
Odou!leH (linie du!l)
GinsetH (c)enar @D)
GoutsetH (c)enar @D) etc.
C/oarea chenar/i
"u a*utorul atri!utului G!order-colorH.
2alori #osi!ile+
GnoneH (niciuna)
un nume de culoare (aEua, red, !lue, etc.)
s#ecificaie numeric de ti# 83>
funcia (r, g, !) cu valori ntre B (i ?II
funcia (r, g, !) cu #rocente ntre B[ (i 5BB[
K@
&e.pli,ica. "tilizarea reg"lilor C(( '
S$i/ defini$ in sec$inea head.
S$i/ defini$ in sec$inea head
S$i/ri iden$ifica$eCidE
KF
S$i/ in/ine
S$i/ defini$ in fisier e3$ern
E3e#!/ !en$r fon$
KI
C/oarea fon$/i !en$r $a(7ri/e !8 &8 h-
C/oarea fond/i $e3$/i
KK
I#a(ine c s$i/
Dis$an$a din$re randri
KL
0on$7+ei(h$
KM
E3e#!/e c chenareF
KN
LB
L5
1ava(cript
Lim!a*ul Dava0cri#t a fost realizat de firmele /etsca#e si 0un si a fost conce#ut ca un lim!a*
care extinde #osi!ilitatile de lucru ale <1M-ului. Lim!a*ul conlucreaza cu <1ML-ul.
Carateristici ale li.ba2"l"i 1ava(cript
$n Dava0cri#t se scriu secvente de #rogram numite scri#turi.Ma*oritatea acestor
secvente sunt alcatuite din functii, care ras#und anumitor evenimente.
$n Dava0cri#t /, se citesc si /, se scriu fisiere;
Dava0cri#t este un lim!a* inter#retat. 'sta inseamna ca !ro-serul #reia o
instructiune , o executa , a#oi #reia o alta instructiune o executa, s.a.m.d.
Dava0cri#t este un lim!a* care utilizeaza o!iecte;
$n Dava0cri#t seface distinctie intre literele mari si literele micui, adica este case
sensitiveH. G
4rorile de sintaxa se de#isteaza greu, dre#t urmare se #oate folosi functia alert ( ).
7oloseste din sintaxa lui "YY si a lim!a*ului Dava
Dava0cri#t lucreaza cu functii definite de #rogramatori sau cuJsi functii #redefinite
4xista trei modalitati de a introduce intr-un document <1ML , si anume+
0cri#tul se scrie in )ead; .Sscri#t language9HDava0cri#tH T siSJscri#tT;
0cri#tul se scrie in !od=; .Sscri#t language9HDava0cri#tH T siSJscri#tT;
0cri#tul a#are ca si fisier extern cu extensia *s, deci Gnume.*sH;
Sscri#t src 9 Gnume.*s HT siSJscri#tT
Li.ba2"l 1ava(cript
1i!ri de da$e si varia&i/e
$n Dava0cri#t exista urmatoarele ti#uri de date + ti# sir; ti# numar intreg; numar intreg in !aza
5B, M sau 5K.
6 varia!ila se #oate declara cu #articular GvarH.
6 varia!ila #oate #rimi orice valoare, nu se declara ti#ul ei.
O!era$ori ari$#e$ici F Y, -, c J, [
YY ,-- , Y (o#erator unar), - (o#erator unar)
O!era$ori re/a$iona/i + S, S9, T, T9
O!era$ori de e(a/i$a$e 9 9 #entru test egalitate
e9 #entru test inegalitate
O!era$ori /o(ici e (negarea logica)
g gff o#eratorul logic GsauH (este o#erator !inar)+ daca cel #utin unul
din o#eranzi este true, rezulta true, altfel rezultatul este false
ZZ o#eratorul logic GsiH
O!era$ori /o(ici !e &i$i SS ,TT o#eratori de de#lasare
L?
Z - GsiH #e !iti
gf - GsauH #e !iti
h - Gsau exclusivH #e !iti
i - Gnegarea #e !itiH- are rolul de a inversa continutul !itilor
O!era$or/ V8W )vir(/e*
O!era$or/ condi$iona/ F e3!- X e3!QFee3!Y4
O!era$or/ de conca$enare
6#eratorul de concatenare #entru siruri este Y
Ins$rc$ini
Ins$rc$ini/e urmatoare au aceiasi sintaxa si semantica ca si in lim!a*ul Dava+
I0
Co#!sa ) ZL.[ *
S+i$ch4
Whi/e4
Do Whi/e
0or
0nc$ii !redefini$e
a/er$ ) C#esa6E* ' afiseaza o caseta in care se afiseaza Gmesa*H
confir#) C#esa6H : caseta afiseaza date de ti# sir. ,tilizatorul #oate a#asa
!utonul 6a , caz in care se returneaza true , sau "ancel, caz in care se returneaza
false
!ro#!$ ) sir\afisa$8 sir\as$e!$a$* 'caseta afiseaza sirCafisat si astea#ta
introducerea valorii in sirCaste#tat. 0irCaste#tat #oate fi initializat cu zero.
esca!es)s*
eva/)s* - s e un 0tring, care conine o#eraii matematice (d. ex.+.G?YFG). 7uncia
returneaz rezultatul acestei o#eraii, n acest caz K. Dac nu este vor!a des#re o
ex#resie calcula!il, atunci se returneaz un mesa* de eroare.
is0ini$e)n* 7 decide dac nr. n este finit
isNaN)3* 7 2erific dac valoarea x este un nr. vala!il (not-a-num!er). 7uncia
returneaz valoarea true, daca x e un nr.
N#&er)3* 7 "onverte(te coninutul o!iectului x n nr. (i l returneaz
!arseIn$ )sir* : converteste un sir catre un intreg. "onversia se face #ina cand
este intilnit un c)aracter care nu este cifra;
!arse0/oa$)sir* - converteste un sir catre o valoare reala. "onversia se face #ina
cand este intilnit un c)aracter care nu este cifra. %unctul este virgule zecimala.
$n Dava0cri#t #utem introduce un text in mod dinamic.
$n Dava0cri#t #utem introduce si tag-uri <1ML.
De exem#lu #utem scrie+ document.-rite(GS!THY text Y GSJ!TH).
L@
E3e#!/ificari $i/izand 2avaScri!$F
'#licatieC5+
'#licatieC?+
LF
Le(a$ra in$re /i#&a6/ 2avaScri!$ si e/e#en$e/e din$r7n for#/ar
%ornim de la o a#licatie concreta, fie un formular care are structura conform imaginii de mai
*os+
Dava0cri#t recunoaste elementele din #agina &4> in doua moduri+
du#a atri!utul name al fiecarui tag, ince#and cu tag-ul SformT si continuand cu
elementele acestuia;
du#a numele im#licit alocat elementelor din #agina. 4lementele de acelasi fel sunt
stocate intr-un vector (arra= j ik ) a carui index ince#e cu valoarea zero.
%entru formularul de mai sus Dava0cri#t creaza o structura ar!orescenta conform #ozitiei
ocu#ata de fiecare element in #agina. %agina se numeste document.
'stfel structura ar!orescenta arata astfel+
doc#en$
\\\\\\\\\\\\\\\\]\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
] ] ] ]
i#a(es ,:. for#s,:. /inKs,:. i#a(es,-.
\\\\\\\\\\]\\\\\\\\\
] ] ]
e/e#en$s,:. e/e#en$s,-. e/e#en$s,Q.
LI
$ntr-un document <1ML #ot crea mai multe formulare, acestea se vor numi im#licit
for#s,:.8 for#s,-.8Le$c.
4lementele fiecarui formular vor fi denumite elementsjBk, elementsj5k,Xetc.
$maginile dintr-o #agina vor fi numerotate ince#ind cu #rima imagine din #agina cu numele
i#a(es,:.8 i#a(es,-.8Le$c.
Lin.-urile dintr-o #agina vor fi si ele numerotate ince#and cu indexul B cu numele /inKs,:.8
/inKs,-.8Le$c.
%entru a acesa #rimul element din formular vom scrie una din urmatoarele secventa in
Dava0cri#t+
-. doc#en$ . for#s ,:.. e/e#en$s,:.
?. doc#en$.f-.n#e ' aceasta ex#resie se foloseste in cazul in care formularul
este descries conform secventei de cod de mai *os+
;for# na#e>?f-?<
$magineC5 S!rTSimg src9c+b",80C&4>C$DC7$/'Lbs.*#gT S!rT
/umeZn!s#Zn!s#Zn!s#Zn!s#Zn!s#F;in!$ $@!e >?$e3$? na#e>?n#e?
va/e>??<S!rT
%renume +Sin#ut t=#e 9text name9#renume value9TS!rT
Sin#ut t=#e9su!mit value9 6a TS!rTS!rTS!rT
$magineC? S!rTSimg src9c+b",80C&4>C$DC7$/'Lbs.*#gT
S!rTS!rT Sa )ref9l.)tmlT SiT&&&.3663L4."6M SJiTSJaT
SJformT
LK
Even$hand/er
<andler-ele de evenimente sunt introduse n SformT ca atri!ute su#limentare n tagurile
<1ML. "a valoare #entru aceste atri!ute, sunt date instruciuni Dava0cri#t, care tre!uie
executate. <andler-ele de evenimente se recunosc du# numele lor. 'cestea nce#, de
exem#lu, cu on"lic..
/r
crt
424/1<'/DL48 1'3,8$L4 <1ML %48M$04
on'!ort img
on>lur a, area, !utton, in#ut, la!el, select, textarea
on")ange $n#ut, select, textarea
on"lic. a., a!!r, acron=m, address, area, !, !ig,
!loc.Euote, !od=, !utton, ca#tion, center, cite,
col, colgrouz#, dd, del, dfn, dir, div, dl, dt, em,
fieldset, form, )x, )r, $, img, in#ut, ins, .!d,
la!el, legend, li, lin., ma#, menu, noframes,
noscri#t, o!*ect, ol, o#tgrou#, o#tion, #, #re, E,
s, sam#, select, small, s#an, stri.e, strong, su!,
su#, ta!le, t!od=, td, textarea, tfoot, t), t)ead, tr,
tt, u, ul, var
onD!l"lic. 2ezi on"lic.
on4rror img
on7ocus a, area, !utton, in#ut, la!el, select, textarea
onae=do-n 2ezi on"lic.
onae=#ress 2ezi on"lic.
onae=u# 2ezi on"lic.
onLoad !od=, frameset
onMousedo-n 2ezi on"lic.
onMousemove 2ezi on"lic.
onMouseout 2ezi on"lic.
onMouseout 2ezi on"lic.
onMouseu# 2ezi on"lic.
on8eset form
on0elect 2ezi on"lic.
on0u!mit form
on,nload 7rameset, !od=
*avascri#t ' , area
7ie urmatorul exem#lu+
0a se scrie un text O'/141,L M4,H folosindu-se culoarea verde. "and se trece cu mous-ul
deasu#ra acestui cuvant acesta sa se transforme in cuvantul '/141e scris cu negru.
1otodata sa se scrie un text in caseta care a#are #e ecran, iar textul scris sa fie afisat intr-o
casuta alert, atunci cand se face clic. in afara casetei , #e ecran.
0olutia este data in figura de mai *os.
LL
A!/ica$ie fo/osind Even$hand/er
LM
O&iec$e
$n lim!a*ul Dava0cri#t sunt multe o!iecte #redefinite; acestea dis#un de #ro#rieti (i metode
s#ecifice, care se #ot folosi direct. $n exem#le sunt folosite o!iectele +indo+ (i doc#en$,
m#reun cu metodele lor, fr ca acestea s fie s#ecificate ex#licit.
6!iectele sunt ordonate ntr-o structur ierar)ic, la vrful ei afndu-se o!iectul -indo-. 0i
descrie fereastra actual a !ro-serului. %e trea#ta urmtoare se afl o!iectul document, care
descrie coninutul #aginii. %e trea#ta urmtoare se afl o!iectul form. %e lng aceste o!iecte,
exist o serie de alte o!iecte.
%entru a #utea folosi un o!iect, tre!uie ca acesta s fie mai nti creat cu a*utorul cuvntului
c)eie One-H (vezi lim!a*ul Dava). 'stfel #ot fi a#elate ulterior diferite #ro#rieti (i metode.
'#licatie+
0 se creeze un o!iect Data (i s se foloseasc o metod a acestui o!iect (de ex. +getDate(),
#t a se afla ziua curent).
"odul sursa este si efectul #e ecran
O&iec$/ +indo+
6!iectul &indo- cores#unde ferestrei curente din !ro-ser si cu a*utorul lui se #ot afla J
modifica #ro#rietatile ferestrei. 4xista #osi!ilitatea de a desc)ide ferestre noi.
6!iectul -indo- este cela mai de sus o!iect din ierar)ia o!iectelor Dava0cri#t. "ores#unde
ferestrei curente din !ro-serul -e!. %rin acest o!iect se #ot afla #rorietile ferestrei curente.
LN
4xist (i #osi!iltatea de a desc)ide ferestre noi. 'sa-numita Ofereastr #rinci#alH a
!ro-serului -e! se #oate a#ela #rin numele rezervate O-indo-H sau OselfH.
%ro#rieti ale o!iectului -indo-+
/r.
crt.
%86%8$41'14 '""40
closed read
default0tatus read, -rite
inner<eig)t read, -rite
inner&idt) read, -rite
location>ar read
menu>ar read
name read, -rite
outer<eig)t read, -rite
outer&idt) read, -rite
#ageA6ffset read
#age`6ffset read
#ersonal>ar read
scroll>ar read
stat!ar read
status read, -rite
tool!ar read
A!/ica$ie\-F
A!/ica$ie\Q
MB
Me$ode !rin care se !oa$e a!e/a o&iec$/ +indo++
/r.
crt.
M416D' D40"8$484
5 alert(s) 8eturneaz 0tringul s ca text ntr-un dialog-!ox.
? !lur() 7ace fereastra inactiv.
@ clear$ntervall(#) 1ermin un evenimentJ#roces infint, ince#ut cu set$ntervall(). #
este #arametrul in care a fost salvat rezultatul din set$ntervall().
F clear1imeout(#) 1ermin un 1imeout care a fost nce#ut cu set1imeout().# este
#arametrul in care a fost salvat rezultatul din set1imeout().
I close() $nc)ide fereastra.
K confirm(s) 8eturneaz 0tringul s ca text ntr-un dialog-!ox., care este
#revazut cu !utoanele de o. si cancel.
L move>=(x,=) Mut o fereatra in directia (x,=)-#ixeli (orizontal(x) sau vertical
(=)). ,n nr. negativ mut fereastra ns#re stnga-sus.
M move1o(x,=) Mut fereastra la coordonatele x,= : #ixeli.
N o#en(#5,#?,#@) Desc)ide o nou fereastr. 'l @-lea #arametru e o#tional.
#5+ adresa (,8L) unui fi(ier , care se vrea desc)is n fereastr.
(,n 0tring gol desc)ide o fereastra goala)
M5
#?+ /umele ferestrei
#@+ (o#tional) Date des#re cum arat fereastra. Mai multe
#ro#ieti se des#art #rin virgul
55 #rom#t(#5,#?) "reeaz un dialog!ox cu ? !utoane analog metodei confirm() (i
un cm# de text (textfield), n care utilizatorul face #ro#riile
remarci.
#5 e un 0tring, care a#are n dialog!ox
#? este textul acre a#are #rima dat n cm#ul de text.
5? resize>=(x,=) Mre(te fereastra cu x #ixeli la drea#ta (i cu = #ixeli n *os. La
valori negative, fereastra se mic(oreaz.
5@ resize1o(x,=) Mre(te fereastra la o marime de x #ixeli n direcie orizontal (i
cu = #ixeli n direcie vertical.
5F scroll1o(x,=) Duce (scroll) fereastra la o anumit #oziie care e dat de coord. x
(i =.
5I set$ntervall(#5,#?) 8uleaz o instruciune ntr-un ritm dinainte dat #n cnd e o#rit
de clear$ntervall()
#5+ instruciune sau funcie Dava0cri#t care tre!uie executat.
#?+ 2aloare in milisecunde, #n cnd se execut #5.
5K set1imeout(#5,#?) 8uleaz o instruciune n funcie de un anumit timeout.
#5+ instruciune sau funcie Dava0cri#t care tre!uie executat.
#?+ 2aloare in milisecunde, #n cnd se execut #5.
Direct din acest o!iect sunt derivate o!iectele doc#en$8 even$8 his$or@ . /oca$ion.
O&iec$/ /oca$ion
6!iectul location ne d adresa <1ML-ului local. "nd o #agin este incarcata (de exem#lu
http!((www.)yz.com(page.html) atunci location.hre$ conine adresa . %entru location.)ref i
#utem atri!ui noi o adres.
'cest !uton G!utton H aduce o nou #agin n fereastra actual (&indo-)
'#licatieC@
M?
O&iec$/ doc#en$
'cest o!iect se refer la coninutul unei ferestre dintr-un !ro-ser.
$n ta!elul urmtor sunt metodele o!iectului document+
5 %86%8$41'14 D40"8$484 '""40
? alin."olor culoarea unui lin. #e care s-a dat clic. read, -rite
@ !g"olor culoarea de fundal read, -rite
F coo.ie #osi!ilitatea de a citi si de a scrie coo.ie-uri read, -rite
I fg"olor culoarea textului (foreground) read, -rite
K lastModified data si ora ultimei modificri read
L lin."olor culoarea lin.urilor care nu au fost nc vizitate read, -rite
M referer adresa ,8L de la care a fost c)emat #agina
curent
read
N title titlul unui fisier <1ML, a(a cum a#are el n
tagul StitleT
read
5B ,8L adresa com#leta a documentului curent read
55 vlin."olor culoarea lin.urilor care au fost vizitate read, -rite
Metode care stau la dis#ozitie
/r.
"rt.
M416D' D40"8$484
5 close() $nc)ide un document care a fost desc)is cu metoda o#en()
? o#en() Desc)ide un document #t scriere. /u se dessc)ide o nou
fereastr, documentul actula se va su#rascrie
@ -rite(s) 0crie 0tringul s n documentul actual
F -ritenln(s) 'nalog metodei -rite(), doar c se trece la linie nou
6!iecte derivate din o!iectul document+ all, anc)ors, a##lets, areas, em!eds, forms, images,
la=ers, lin.s, #lugins.
A!/ica$ieF
M@
O&iec$/ for#s
'cest o!iect #une la dis#oziie metode (i #ro#rieti care #ermit accesul la un formular
definit n interiorul unui fi(ier <1ML
'ccesul la un formular se #oate face #rin @ metode+
5. #rin numele formularului - ;for# na#e>C0or#NAMEC<
'cces + doc#en$.0or#NAME.rese$)*
5. #rin indexul formularului. %rimul formular #rimeste B etc.
'cces + doc#en$.for#s,9..rese$)*
?. %rin numele formularului ca indicator al indexului. /umele se d cu atri!utul name
din tagul SformT
'cces + doc#en$.for#s,I0or#NAMEC..rese$)*
%86%8$41'14 D40"8$484 '""40
action retine cuvntulJvaloarea sta!ilitJ n
atri!utul action din tagul SformT
read, -rite
encoding retine cuvntulJvaloarea sta!ilitJ n
atri!utul encoding din tagul SformT
read, -rite
lengt) reine nr. formularelor dintr-un fisier read
met)od retine valoarea sta!ilitJ n atri!utul
met)od din tagul SformT
read, -rite
name retine cuvntulJvaloarea sta!ilitJ n
atri!utul name din tagul SformT
read, -rite
target reine numele frame-ului care s devin
activ du# trimiterea unui formular
read, -rite
M416D' D40"8$484
reset() 0terge toate datele introduse ntr-un formular, si are aceea(i
funcie ca !utonul care se introduce cu atri!utul t=#e9reset
su!mit() 1rimite un formular, si are aceea(i funcie ca !utonul care
se introduce cu atri!utul t=#e9su!mit
MF
'#licatie com#lexa +
O&iec$/ i#a(e
'cest o!iect se afla n ierar)ie su! o!iectul document. se refer la #ro#rietile imaginii
introduse in <1ML. 'ceste #ro#rieti #ot fi modificate n interiorul unui fi(ier <1ML.
6!iectele image se #ot a#ela in felul urmator+
5. 7olosirea unui index. %rima imagine #rime(te nr. B.
doc#en$.i#a(es,:..src
?. %rin numele imaginii din tagul img
;i#( na#e>CBILDC src>C$.6!(C<
doc#en$.BILD.src
/ %86%8$41'14 D40"8$484 '""40
5 >order conine indicaii des#re margine, a(a cum se
gsesc ele in tag-ul img
read
? "om#lete e true atunci cnd imaginea e com#let
inacrcat
read
MI
@ <eig)t conine indicaii des#re nlimea #ozei read
F <s#ace conine indicaii des#re distanta orizonatala
fata de o!iectele din *ur
read
I Lengt) retine nr. imaginilor dintr-un fi(ier read
K Lo-src reine lo-src asa cum e in tagul img read
L /ame reine numele #ozei asa cum e in tagul img read
M 0rc reine numele intreg al fisierului asa cum e in
atri!utul src
read
N 2s#ace conine indicaii des#re distanta vertical fata
de o!iectele din *ur
read
5B -idt) conine indicaii des#re laimea #ozei read
%e lng metoda )andle4vent(), care este inter#retat numai de /etsca#e /avigatoro!iectul-
image conine (i alte metode #ro#rii.
O&iec$/ da$e
0e folose(te #emtru calcularea datei (i a oreiJtim#ului. ,n o!iect date se #oate face n felul
urmtor+
Sscri#t language9GDava0cri#tGT
7unction sim#leDate()
V
Date59 ne- Date();
Date?9 ne- Date(````,MM,DD);
Date@9 ne- Date(GMM DD ```` <<+mm+ssH);
DateF9 ne- Date(```,MM,DD,<<,mm,ss);
W
SJscri#tT
O&iec$/ navi(a$or
"onine informaii des#re !ro-ser (i se #oate folosi #entru a ada#ta mai !ine scri#tul fiecrui
!ro-ser n #arte.

%86%8$41'14 D40"8$484 '""40
a##"ode/ame "onine nic.nameul !ro-serului(d.ex.,
/etsca#e ur(te nic.name-ul GMozillaH)
read
a##/ame 8eine numele !ro-serului n care
ruleaz scri#tul
read
a##2ersion 8eine nr. versiunii !ro-serului n care
ruleaz scri#tul
read
language "onine lim!a*ul n care este instalat
scri#tul(doa /etsca#e)
read
#latform 8eine numele sistemului de o#erare #e
care este instalat scri#tul (doar
/etsca#e)
read
user'gent 8eine informaii de !ro-ser, acelea(i read
MK
#e care le transmite !ro-serulul (i la o
a#elare )tt#
6!iectul navigator s#une, #rin metoda *avaena!led(), dac n !ro-ser este activat Dava, astfel
nct s se (tie dac se #ot folosi a##leturi. Dac Dava este acce#tat, metoda returneaz true.
O&iec$/ /a@ers ' )a//7*
*ste valabil doar pentru browsere +etscape (i conine informaii des#re un nivelulJla=er care
este accesi!il unui fi(ier <1ML. /ivelurileJla=er-ele sunt !aza #ositionrii dinamice a
elementelor n #agin. 6!iectul la=ers este su! o!iectul document n ierar)ia o!iectelor..
,biectul all este accesibil numai cu browsere *)plorer . 'cest o!iect conine #ro#rietile (i
metodele realizrii acestui conce#t+
'#elarea la=ers+
5. #rin index, care caracterizeaz straturile. %rimul nivel are index B.
doc#en$./a@ers,R..a&ove
?. 8eferenierrea #rin numele la=er-ului
;/a@er na#e>CLa@er:C<
doc#en$. La@er:.a&ove
%86%8$41'14 D40"8$484 '""40
a!ove "onine o!iectul la=er care se afla deasu#ra
niivelului actual
read
!ac.ground !ac.ground-ul la=er-ului read, -rite
!gcolor culoarea fundaluilui la=er-ului read, -rite
!elo- o#usul lui a!ove read, -rite
cli# care #arteJtietur a la=erului este artat read, -rite
document %t fiecare nivel exist un o!iect document, care i
conine caracteristicile
read,
left "onine #oziia colului din stnga sus a
la=erulului (n #ixeli), ra#ortat la documentul de
deasu#ra.
read, -rite
lengt) /r. la=er-elor dintr-un fi(ier <1ML read,
name /umele la=erului read, -rite
#ageA %oziia #e axa A a colului din stnga sus a la=er-
ului, ra#ortat la ntreg documentul.
read, -rite
#age` %oziia #e axa ` a colului din stnga sus a la=er-
ului, ra#ortat la ntreg documentul.
read, -rite
#arentLa=er 8eune o!iectul-#rinte al la=erului, adic
documentul de deasu#ra
read,
src "onine numele unui document extern, introdus
n la=er
read, -rite
to# "onine #oziia #e axa ` a colului din stnga sus
a la=erulului (n #ixeli), ra#ortat la documentul
de deasu#ra.
read, -rite
visi!ilit= informaii des#re visi!ilitatea unui la=er. 2alori
#osi!ile+ )ide, s)o-, in)erit
read, -rite
ML
Metode #entru la=ere
M416D4 D40"8$484
ca#ture4vents() 0u#raveg)eaz evenimentele din la=er-ul actual.
)andle4vent() D mai de#arte evenimentul unui element care se #oate ocu#a
de el.
load(#5,#?) $ncarc un fi(ier extern n la=er.
#5-numele fi(ierului
#?-limea vizi!ila din la=er (#ixeli)
move'!ove(#5) Mut la=er-ul deasu#ra la=er-ului dat de #arametrul #5.
move>elo-(#5) Mut la=er-ul su! la=er-ul dat de #arametrul #5.
move>=(#5,#?) Mut la=erul curent cu #5 #ixeli la stngaJdrea#ta (i cu #? #ixeli
mai sus sau mai *os.
move1o(#5,#?) Mut la=er-ul la o nou #oziie dat de #5 (i #?. 'ceasta este
#osiia colului din stnga sus al la=er-ului.
release4vents() 1ermin su#raveg)erea de evenimente.
resize>=(#5,#?) 0c)im! mrimea la=erului cu+
#5-mrimea n directia de #e axa x
#?-mrimea n direcia #e axa =
resize1o(#5,#?) 6 nou mrime #t la=er.
#5-mrimea n directia de #e axa x
#?-mrimea n direcia #e axa =
route4vent() D evenimentul mai de#arte o!iectului document. De acolo
a*unge la un event)andler care i este su!ordonat.
"ro!rie$Ji Hi #e$ode !en$r o&iec$/ a//
'#elare+
5. #rin numele tagului sau identificatorului tagului (i un index care conine #oziia sa.
de exem#lu+ #t tagul StitleT, numele este GtitleH. $ndexul s#une al ctela tag cu acest
nume este referit. %rimul tag are indexul B.
7ie @ tilturi referite #rin tagul S)?T. 'ccesul la tagul al doilea se face astfel+
doc#en$.a//.$a(s)IhQC*,-..inner1e3$
?. #rin numele dat cu atri!utul GnameH
z.> + S)? name9G1itle?GT1$1L4 ? SJ)?T
doc#en$.a//.1i$/eQ.inner1e3$
/r.crt %8%8$41'14 D40"8$484 '""40
5 class/ame /umele clasei st=le-s)eet, careia
i a#arine un element.
read, -rite
? data7ld /umele unui cm# de date. read, -rite
@ data7ormatr's 1i#ul unui cm# de date. read, -rite
F data%age0ize /umrul data#age-urilor care
tre!uie returnate simultan
read, -rite
MM
I data0rc 8eferina la o!iectul cu care s-a
realizat conexiunea
read, -rite
K id /umele unui element read,
L inner<1ML "oninutul unui element 3<tml read, -rite
M inner1ext "oninutul textual al unui elemnt
3<tml.
read, -rite
N is1ext4dit true-dac elementul este edita!il,
false dac nu
read,
5B lang Lim!a*ul elementului, atta tim#
ct acesta a fost menionat n
atri!utul lang.
read, -rite
55 language /umele lim!a*ului scri#t read,
5? lengt) /r tagurilor <1ML dintr-un
fisier.
read,
5@ offset<eig)t $nlimea elementului n #ixeli. read,
5F offsetLeft Distana elementului #n la
marginea stng a ferestrei.
read
5I offset%arent 6 referin la o!iectul #rinte. read,
5K offset1o# Distana elementului #n la
marginea de sus a ferestrei.
read,
5L offset&idt) Limea unui element in #ixeli read
5M outer<1ML "oninutul unui tag <1ML,
incusiv al celor de nce#ut (i
sfr(it.
read, -rite
5N outer1ext idem inner1ext read, -rite
?B #arent4lement 4lementul #rinte al elementului
curent.
read,
?5 #arent1ext4dit 4lementul urmtor care este
edita!il.
read,
?? record/um!er /umrul data #age-ului artat read,
?@ source$ndex 0#une des#re care element din
interiorul unui fi(ier <1ML este
vor!a n actualul
elementJdocumentlll.
read,
?F tag/ame /umele unui tag read,
?I title "oninutul atri!utului title al
elementului <1ML.
read, -rite
/r.crt M416D' D40"8$484
5 "lic.() "auzeaz clic.-ul unui element, ca (i cnd acesta ar fi
fost clic.-enit de utilizator.
? "ontains(#5) 2erific dac elemntul conine (i un alt element, al crui
nume (id) este dat de #5. 8eturneaz true, dac exist un
astfel de element.
@ get'ttri!ute(#5,#?) 2erific dac exist n tagul <1ML un atri!ut dat #rin
#5. #? este #us #e true, dac se ia n seama dac se scrie
cu litere mari sau sau mici. 7uncia returneaz valoarea
MN
atri!utului sau un 0tring gol.
F insert'd*acent<1ML(#5,#?) $ntroduce cod <1ML su#limentar, nainte sau du#
elementul <1ML.
#5-#oziia unde tre!uie introdus. 2alori #osi!ile+
>efor>egin, 'fter>egin, >efor4nd, 'fter4nd.
#?-codul care tre!uie introdus.
I insert'd*acent1ext(#5,#?) idem insert'*acent<1ML, cu diferena c se introduce
text.
K remove'ttri!ute(#5,#?) $nde#rteaz un atri!ut dintr-un tag <1ML.
#5-numele atri!utului n tag.
#?-true-dac e case sensitive.
L scroll$nto2ie-(#5) %oziioneaz coninutul astfel n fereastr, nct s #oat
fi vizi!il.
#5-true-dac elementul tre!uie s a#ar sus n fereastr.
#5-false- dac elementul tre!uie s a#ar *os n fereastr.
M set'ttri!ute(#5,#?,#@) $ntroduce ntr-un tag )tml un nou atri!ut.
#5-numele atri!utului.
#?-valoarea acestui atri!ut
#@-true-dac e case sensitive.
4xem#lu de cod com#let #entru o metod care este a#elat #rin #ro#rietile !ro-serului (i
care ine cont de elementele s#ecifice !ro-serelor /etsca#e (i 4x#lorer+
7unction c)ec.>ro-ser()
V
var !ro-ser/ame9navigator.a##/ame;
var !ro-ser/ic.name9navigator.a##"ode/ame;
var !ro-ser2ersion9#arse7loat(navigator.a##2ersion);
var !ro-ser$nfos9navigator.user'gent;
var is/etsca#e9false;
var isMicrosoft9false;
-indo-.document.-rite(G>ro-ser +HY!ro-ser/ame);
if(!ro-ser/ame99HMicrosoft $nternet 4x#lorerH)
V
isMicrosoft9true;W
W
if(!ro-ser/ame 99G/etsca#eG)
V
is/etsca#e9true;
W
$f(isMicrosoft)
V
$f(navigator.a##.2ersion.index6f(OM0$4G)e9-5)
NB
Vversiontm#59navigator.a##2ersion.index6f(GM0$4H)YF;
2ersiontm#?9versiontm#5YI;
!o-ser2ersion9navigator.a##2ersion.su!string(versiontm#5, versuiontm#?);
WW
-indo-.document.-rite(GS!rT 2480$6/ +HY!ro-ser2ersion);
-indo-.document.-rite(GS!rT /$"a/'M4 +HY!ro-ser/ic.name);
-indo-.document.-rite(GS!rT user'gent +HY!ro-ser$nfos);
if(is/etsca#e)
V
-indo-.document.-rite(GS!rT /410"'%4 0%4m$7$a'1$6/9 999999+H);
-indo-.document.-rite(GS!rT 0=stem +HYnavigator.#latform);
-indo-.document.-rite(GS!rT Language +HYnavigator.language);
-indo-.document.-rite(GS!rT 999H);
W
alert(G>86&048 + GY!ro-ser/ameYHbnHYH 2480$6/ +HY!ro-ser2ersion);
return;
W
O&iec$/ Ma$h.
"ontine constante si metode #entru a #utea folosi functii matematice
"onstante+ %$ ( numarul #i9@,5F..) 4 (e9?,L5..).
Metode+
a!s(x) : modulul
cos(x)
tan(x)
sin(x)
acos(x)
asin(x)
atan(x)
floor(x)+-cel mai mare intreg mai mic sau egal cu x. 4xem#lu + Mat).floor(-@,L@), returneaza -F.
(re#rezentarea unui numar real su! forma de o suma dintre #arte intreaga si #arte fractionara x9jxkYVxW;
BS9VxWS5; -?,K@9 -@YB,@L)
random(x)+- nr aleator in intervalul jB,5k
round(x)+ cel mai a#ro#iat intreg de x
sErt(x) :radical din x
#o-(x,=) -x la #uterea =
log(x)-Tln x
ex#(x) e la #uterea x
4xem#lu + Mat).floor(5Y5BBcMat).random()); va returna un nr aleator cu#rins intrej5,5B5k.
O&iec$/ Arra@
$n Dava0cri#t se #ot declara numai vectori . 2ectorii sunt de ti# o!iect . ,n vector se declara
cu 'rra=() iar elementele se acceseaza cu numejindicek;
N5
6!iecte si metode ale o!iectului 'rra=+
#ro#rietatea /en($h ;
metoda sor$)* : sorteaza in ordine lexicograficaelementele unui ta!lou;
metoda reverse)* inverseaza #ozitiile elementelor unui vector;
4xem#lu + vv9ne- 'rra=(F); vvj?k9K; alert(vvj?k);
Declararea unei matrici de F linii si @ coloane se face astfel+
vv9ne- 'rra=(F);
for (i9B;iSF;iYY) vvjik9ne- 'rra=(@);
7iecare element al vectorului este #rivit ca un vector.
O&iec$/ S$rin(
"u acest o!iect se #ot mani#ula siruri de caractere.
Crearea unui string se #oate crea in doua moduri +
utilizand ne- + var a 9 ne- 0tring (G'naH) ;
atri!uid varia!ilei direct sirul +a 9 G'naH;
6!iectul 0tring are #ro#ritatea lengt).
Me$ode. 4xista o serie de metode ale acestui o!iect , enumeram cateva dintre acestea+
search)s* : cauta caracterul de ince#ut al sirului GsH in o!iect. Daca sirul GsH nu exista se returneaza
-5.
charA$)inde3* : returneaza caracterul aflat #e #ozitia index;
s/ice )i-8 iQ) : returneaza su!string-ul cu#rins intre i5 inclusiv si i? exclusiv.
s&s$r)i-8/n(* : returneaza su!sirul care ince#e cu i5 si are lungime lung;
N?
$o5!!erCase )* : returneaza sirul scris cu litere mari;
$oLo+erCase)* - returneaza sirul scris cu litere mici;
re!/ace)sir-8 sirQ* : returneaza sirul in care s-a inlocuit #rima a#aritie a lui sir5 cu sir?;
&o/d)* : returneaza sirul scris cu !old;
i$a/ics)* - returneaza sirul scris cu italic;
fon$co/or)Cn#e\c/oareE* : returneaza sirul scris cu Gn#e\c/oareE
fon$size)C#ari#eE* 7 returneaza sirul scris cu C#ari#eE
/inK)Cadresa\h$$!E* ' creaza o ancora catre adresa\h$$!
'#licatie utilizand metode ale o!iectului 0tring
N@
Ani#a$ii
%rin afisarea in aceiasi #ozitie a mai multor imagini, fiecare imagine GstandH un anumit
interval de tim# duce la animatie. 4xista anumite functii #redefinite si functii utilizatorcare
rezolva aceasta #ro!lema.
0nc$ia se$1i#eo$
0intaxa +
set1imeout(GnumeCfunctieH, nrCmilisecunde)
0emantica +
numeCfunctie este functia care urmeaza a se executa du#a nrCmilisecunde;
nrCmilisecunde : un numar intreg care milisecunde
0nc$ia c/ear1i#eo$
0intaxa +
clear1imeout(Gvaria!ilaH)
0emantica +
Gvaria!ilaH contine o valoare returnata de functia set1imeout. Du#a executarea ei
#rocesul se sus#enda;
NF
A!/ica$ie co#!/e3e $i/izand /i#&a6/ 2avaScri!$
A!/ica$ie\-
NI
Cod/ srsa a/ a!/ica$iei\- de #ai ssF
S)tmlT
S)eadT
Sscri#t language9Dava0cri#tT
function suma()
V
a9#arse$nt(document.form5.in#uta.value);
!9#arse$nt(document.form5.in#ut!.value);
document.form5.s.value9aY!;
W
function diferenta()
V
a9#arse$nt(document.form5.in#uta.value);
!9#arse$nt(document.form5.in#ut!.value);
document.form5.d.value9a-!;
W
function #rodus()
V
a9#arse$nt(document.form5.in#uta.value);
!9#arse$nt(document.form5.in#ut!.value);
document.form5.#.value9ac!;
W
function catCrest()
V
a9#arse$nt(document.form5.in#uta.value);
!9#arse$nt(document.form5.in#ut!.value);
document.form5.c.value9Mat).floor(aJ!);
document.form5.r.value9a [ !;
W
function calcCinvers()
V
n9#arse$nt(document.form?.in#ut.value);
cifra9B;inv9B;
-)ile(ne9B)
V
cifra9n [ 5B;
n9(n-cifra)J5B;
inv9invc5BYcifra;
W
document.form?.invers.value9inv;
W
function test()
V
n9#arse$nt(document.form?.in#ut.value);
cifra9B;inv9B; nCinit9n;
-)ile(ne9B)
V
NK
cifra9n [ 5B;
n9(n-cifra)J5B;
inv9invc5BYcifra;
W
if (nCinit99inv) document.form?.#alindrom.value9da
else document.form?.#alindrom.value9nu;
W
function transfCdin!aza5B()
V
n9#arse$nt(document.form@.in#ut.value);
!9#arse$nt(document.form@.!aza.value);
i9B,a9;
var sir9ne- 'rra=();
do
V
cifra 9 n[!;
if (cifraTN)
V
s-itc) (cifra)
V
case 5B+ cifra9n'n;!rea.;
case 55+ cifra9n>n;!rea.;
case 5?+ cifra9n"n;!rea.;
case 5@+ cifra9nDn;!rea.;
case 5F+ cifra9n4n;!rea.;
case 5I+ cifra9n7n;!rea.;
W
W
sirjik 9 cifra;
iYY;
n9Mat).floor(nJ!);
W
-)ile(n);
for (*9i-5;*T9B;*--) a9 aYsirj*k;
document.form@.transf.value9a;
W
function calcCmodulul()
V
a 9 document.formF.re.value;
! 9 document.formF.img.value;
z5 9 ne- 6!*ect();
z5.real 9 #arse$nt(a);
z5.imaginar 9 #arse$nt(!);
modul9Mat).sErt(z5.realcz5.realYz5.imaginarcz5.imaginar);
document.formF.modul.value9modul;
NL
W
function inlocuireClitera()
V
sir 9 document.formI.in#ut.value;
sir 9 sir.re#lace(JuJg,a);
document.formI.out#ut.value9sir;
W
function sortareCalfa!etica()
V
sir 9 document.formK.in#ut.value;
var a9ne- 'rra=();
var i,.9B,alfa!etic9;
for(i9B;iSsir.lengt);iYY)
V aj.k9sir.c)ar't(i);.YY;W

a.sort();
for(i9B;iS.;iYY)
alfa!etic9alfa!eticYajik;
document.formK.out#ut.value9alfa!etic;
W
SJscri#tT
SJ)eadT
S!od=T
SulT
SliTSiT 0uma, diferenta, #rodusul, si catul a doua numere S!TaSJ!T si S!T!SJ!T SJiTS!rT
Sform name9form5T
a+ Sin#ut t=#e9text name9in#uta size95FT S!rT
!+ Sin#ut t=#e9text name9in#ut! size95FT S!rT
0uma+ Sin#ut t=#e9text name9s size95FT Sin#ut t=#e9!utton value9'duna
on"lic.9suma()T S!rT
Diferenta+ Sin#ut t=#e9text name9d size95FTSin#ut t=#e9!utton value90cade
on"lic.9diferenta()T S!rT
%rodusul+ Sin#ut t=#e9text name9# size95FTSin#ut t=#e9!utton value9$nmulteste
on"lic.9#rodus()T S!rT
"atul + Sin#ut t=#e9text name9c size95FT Sin#ut t=#e9!utton value9$m#arte
on"lic.9catCrest()T S!rT
8estul+ Sin#ut t=#e9text name9r size95FT S!rT
SJformTSJliT
SliTSiT$nversul unui numar si se testarea daca este #alindromSJiT
Sform name9form?T
/umarul+ Sin#ut t=#e9text name9in#ut size95FT S!rT
$nversul+ Sin#ut t=#e9text name9invers size95FT
Sin#ut t=#e9!utton value9"alculeaza on"lic.9calcCinvers()T S!rT
%alindroml Sin#ut t=#e9text name9#alindrom size95FT
NM
Sin#ut t=#e9!utton value91esteaza on"lic.9test()T S!rT
SJformTSJliT
SliTSiT 1ransformare din !aza 5B in !aza ?, M sau 5KSJ!TSJiT
Sform name9form@T
/umarul+ Sin#ut t=#e9text name9in#ut size95FT S!rT
>aza+ Sin#ut t=#e9text name9!aza size95FT Sin#ut t=#e9!utton value9"alculeaza
on"lic.9transfCdin!aza5B()T S!rT
/umarul este+ Sin#ut t=#e9text name9transf size95FT S!rT
SJformTSJliT
SliTSiT Modulul unui numar com#lexSJiTS!rT
Sform name9formFT
z5+ Zn!s#; Sin#ut t=#e9text name9re size95FT Sin#ut t=#e9text name9img
size95FT
Sin#ut t=#e9!utton value9"alculeaza on"lic.9calcCmodulul()TS!rT
Modulul+ Sin#ut t=#e9text name9modul size95FT S!rT
SJformTSJliT
SliTSiT $nlocuirea literei u cu litera a intr-un sir de caractere SJiTS!rT
Sform name9formIT
0irul+ Sin#ut t=#e9text name9in#ut size95FT Sin#ut t=#e9!utton
value9$nlocuieste on"lic.9inlocuireClitera()T S!rT
Du#a inlocuire+ Sin#ut t=#e9text name9out#ut size95FT S!rT
SJformTSJliT
SliTSiT 6rdonarea alfa!etica a unui cuvant SJiT S!rT
Sform name9formKT
0irul+ Sin#ut t=#e9text name9in#ut size95FT Sin#ut t=#e9!utton value90orteaza
on"lic.9sortareCalfa!etica()T S!rT
'lfa!etic+ Sin#ut t=#e9text name9out#ut size95FT S!rT
SJformTSJliT
SJulT
SJ!od=T
SJ)tmlT
NN
A!/ica$ie\Q F Rea/izarea ni #inica/c/a$or de &znar c 2avaScri!$
Cod/ srsa !en$r a!/ica$ia\Q
S)tmlT
S)eadT
Sscri#t language9Dava0cri#tT
var str9, o#erator9,str?9;
function in#ut(val)
V
if(str.lengt)S5B) str9strYval;
document.form5.text5.value9str;
W
function add()
V
if (o#erator99)V
str?9document.form5.text5.value;
str9;
document.form5.text5.value9str;
o#erator9Y; W
W
function su!()
V
if (o#erator99)V
str?9document.form5.text5.value;
str9;
document.form5.text5.value9str;
5BB
o#erator9-; W
W
function mult()
V
if (o#erator99)V
str?9document.form5.text5.value;
str9;
document.form5.text5.value9str;
o#erator9c; W
W
function div()
V
if (o#erator99)V
str?9document.form5.text5.value;
str9;
document.form5.text5.value9str;
o#erator9J; W
W
function resolve()
V
var rez9B;
s-itc) (o#erator)
V
case Y+ rez 9 (str?c5) Y (strc5) ;
document.form5.text5.value 9 rez;
!rea.;
case -+ rez 9 (str?c5) - (strc5);
document.form5.text5.value 9 rez;
!rea.;
case c+ rez 9 (str?c5) c (strc5);
document.form5.text5.value 9 rez;
!rea.;
case J+ rez 9 (str?c5) J (strc5);
document.form5.text5.value 9 rez;
!rea.;
W
o#erator9; str9; str?9;

W

function clearall()
V
document.form5.text5.value9;
str9; str?9; o#erator9;

5B5
W
SJscri#tT
SJ)eadT
S!od=T
S!rTS!rTS!rTS!rT
ScenterT
Sta!le !order95 !gcolor9lig)t!lueT
Sform name9form5T
StrTStdT
Sin#ut t=#e9text name9text5 st=le9color+nav=;font--eig)t+ !old size9?BT
SJtdTSJtrT
StrTStdT
Zn!s#;
SJtdTSJtrT
SJta!leT
Sta!le !order9@ !gcolor9lig)t!lueT
StrTStd align9centerT
Sin#ut t=#e9!utton value9 5 st=le9color+nav=;font--eig)t+ !old
on"lic.9in#ut(5)T
Sin#ut t=#e9!utton value9 ? st=le9color+nav=;font--eig)t+ !old
on"lic.9in#ut(?)T
Sin#ut t=#e9!utton value9 @ st=le9color+nav=;font--eig)t+ !old
on"lic.9in#ut(@)T
Sin#ut t=#e9!utton value9 Y st=le9color+nav=;font--eig)t+ !old on"lic.9add()T
SJtdTSJtrT
StrTStd align9centerT
Sin#ut t=#e9!utton value9 F st=le9color+nav=;font--eig)t+ !old
on"lic.9in#ut(F)T
Sin#ut t=#e9!utton value9 I st=le9color+nav=;font--eig)t+ !old
on"lic.9in#ut(I)T
Sin#ut t=#e9!utton value9 K st=le9color+nav=;font--eig)t+ !old
on"lic.9in#ut(K)T
Sin#ut t=#e9!utton value9 - st=le9color+nav=;font--eig)t+ !old on"lic.9su!()T
SJtdTSJtrT
StrTStd align9centerT
Sin#ut t=#e9!utton value9 L st=le9color+nav=;font--eig)t+ !old
on"lic.9in#ut(L)T
Sin#ut t=#e9!utton value9 M st=le9color+nav=;font--eig)t+ !old
on"lic.9in#ut(M)T
Sin#ut t=#e9!utton value9 N st=le9color+nav=;font--eig)t+ !old
on"lic.9in#ut(N)T
Sin#ut t=#e9!utton value9 c st=le9color+nav=;font--eig)t+ !old on"lic.9mult()T
SJtdTSJtrT
5B?
StrTStd align9centerT
Sin#ut t=#e9!utton value9 " st=le9color+nav=;font--eig)t+ !old
on"lic.9clearall()T
Sin#ut t=#e9!utton value9 B st=le9color+nav=;font--eig)t+ !old
on"lic.9in#ut(B)T
Sin#ut t=#e9!utton value9 9 st=le9color+nav=;font--eig)t+ !old
on"lic.9resolve()T
Sin#ut t=#e9!utton value9 J st=le9color+nav=;font--eig)t+ !old on"lic.9div()T
SJtdTSJtrT
SJformTSJta!leT
SJ!od=T
SJ)tmlT
A!/ica$ia\Y
0e se introduca intr-un ele,ment al unui formular o valoare si a#asand #e tasta 6a5I[ sa se
calculeze 5I[ din acea valoare
5B@
A!/ica$ia 9 F 6#eratii cu numere com#lexe si afisarea unor rezultate in caseta de alert. 0e va
introduce un numar com#lex intr-un formular de forma z5 9 aY!c$, iar al doilea numar va fi
z? 9 !Yaci
Cod/ srsa !en$r a!/ica$ia 9F
S)tmlT
S)eadT
Sscri#t language9Dava0cri#tT
function com#lex(x,=)
Vt)is.real9x;
t)is.img9=;
t)is.adun9add;
t)is.inmultire9mult;
t)is.im#artire9div;
W
z9ne- com#lex(B,B);
function getData8(a)
Vz.real9#arse$nt(a);
alert(z.real 9 Yz.real);
document.f5.rez5.value9a;
return;W
function getData$(!)
5BF
Vz.img9!;
alert(z.img 9 Yz.img)
document.f5.rez?.value9!;
return;W
function add(z)
Vt9ne- com#lex(B,B);
t.real9eval(t)is.real)Yeval(z.real);
t.img9eval(t)is.img)Yeval(z.img);
alert(t.real add9 Yeval(t.real));
return t;
W
function mult(z)
Vt9ne- com#lex(B,B);
t.real9eval(t)is.real)ceval(z.real)-eval(t)is.img)ceval(z.img);
t.img9eval(t)is.real)ceval(z.img)Yeval(t)is.img)ceval(z.real);
alert( 84m,L1'1 $/148M4D$'8 t.real mul9 Yeval(t.real));
return t;
W
function div(z)
Vt9ne- com#lex(B,B);
t.real9(eval(t)is.real)ceval(z.real)Yeval(t)is.img)ceval(z.img))J(z.realo?-z.imgo?);
t.img9(eval(t)is.real)ceval(z.img)-eval(t)is.img)ceval(z.real))J(z.realo?-z.imgo?);
alert( 84m,L1'1 $/148M4D$'8 t.real div9 Yeval(t.real));
return t;
W
function calcul(a,!)
V
z@'9ne- com#lex(B,B);
z@$9ne- com#lex(B,B);
z@D9ne- com#lex(B,B);
z59ne- com#lex(a,!);alert(data com#lexa z59 Yz5.realY Y Yz5.imgYi);
z?9ne- com#lex(!,a);alert(data com#lexa z? 9Yz?.realY Y Yz?.imgYi);
z@'9z?.adun(z5)
alert('D,/'84 9Yz@'.realYYYz@'.imgYi);
z@$9z?.inmultire(z5);
alert($/M,L1$84 9Yz@$.realY YYz@$.imgYi);
z@D9z?.im#artire(z5);
alert($M%'81$84 9Yz@D.realY Y Yz@D.imgYi);
W
5BI
SJscri#tT
SJ)eadT
S!od=T
Sform name9f5T
8eal(z) +Sin#ut t=#e 9text name9$n#ut5 value9BT Zn!s# Zn!s#
$maginar(z)+Sin#ut t=#e 9text name9$n#ut? value9BTS!rT
Sin#ut t=#e9!utton value96a-84'L on"lic.9getData8(document.f5.$n#ut5.value)T
Zn!s# Zn!s#Zn!s# Zn!s#Zn!s#Zn!s# Zn!s#Zn!s# Zn!s#Zn!s# Zn!s# Zn!s#Zn!s#
Zn!s#Zn!s# Zn!s#Zn!s# Zn!s#Zn!s# Zn!s#Zn!s# Zn!s#Zn!s# Zn!s#
Sin#ut t=#e9!utton value96a-$maginar
on"lic.9getData$(document.f5.$n#ut?.value)TS!rT
'fisez 8eal(z)+Sin#ut t=#e9text name9rez5TZn!s# Zn!s#
'fisez $maginar(z)+Sin#ut t=#e9text name9rez?TS!rTS!rTS!rTS!rT
Sin#ut t=#e9!utton value96a - alert( )
on"lic.9calcul(document.f5.$n#ut5.value,document.f5.$n#ut?.value)T
SJformT
SJ!od=T
SJ)tmlT
5BK
A!/ica$ia R F 0a se scrie un text care isi sc)im!a culoarea si cand mousul ramane #e
imaginea de #e dis#la=, aceasta se mareste #ina cand mous-ul este luat de #e imagine.
Cod/ srsa !en$r a!/ica$ia R
;)tmlT
S)eadT
Sst=leT
\1itlu V color+rg!(5@B,5?,55@); font-size+FB;W
SJst=leT
5BL
Sscri#t language9Dava0cri#tT
var t9B,inalt9B, latime9B;
function move() V
if(t99B) V
latime9foto.-idt);
inalt9foto.)eig)t;
t95;W
foto.-idt)YY;
foto.)eig)tYY;W
function out()
V
t9B;
foto.-idt)9latime;
foto.)eig)t9inalt;
W
i9?II;
tt9B;
function lumina()
Vdo
Vi--;
1itlu.st=le.color9?IIc?IKc?IKYic?IKci;
tt9set1imeout(lumina(),5BB);
if(i99B) clear1imeout(tt);W -)ile(iTB)
W
SJscri#tT
SJ)eadT
S!od= onload9lumina()T
Simg id9foto src9t5.*#g onmouseout9out() onmousemove9move() -idt)9MB
)eig)t9MBT
S)5 id91itluT $D - $/2'1'M'/1 L' D$01'/1' SJ)5T
S!rTS!rT
SJ!od=T
SJ)tmlT
5BM
Li.ba2"l PHP
Lim!a*ul %<% se aseamana cu "YY. 4ste un lim!a* de scri#tare care se utilizeaza #e #artea
de server. /u toate site-urile acce#ta %<%. "and scriem un scri#t in %<% vom rula direct de
#e site. 4xista insa #osi!ilitatea de a test a#e #ro#riul calculator, acest lucru necesita instalari
s#eciale.
"odul %<% este inter#retat #e serverul &4> si genereaza un cod <1ML care va fi vazut de
uilizator (clientului (!ro-serului) fiindu-i transmis numai cod inter#retat ca si <1ML).
%<% a fost conce#ut in anul 5NNF si a fost initial munca unui singur om, 8asmus Lerdorf.
$n octom!rie ?BB?, era folosit de mai mult de noua milioane de domenii din lumea intreaga.
%<% este un #rodus 6#en 0ource, cu acces la codul sursa. $l #utem folosi, modifica si
redistri!ui, toate acestea in mod gratuit.
%<% a fost initial acronimul de la %ersonal <ome %age.
Pri.ii pasi
%entru a #utea lucra cu !aze de date #e server tre!uie sa instalam serverul de '#ac)e si
M=0El.
4xiste #rograme care instaleaza automat aceste servere, de exem#lu &inL'M% si se #oate
descarca de #e 3oogle.
$n continuare, tre!uie sa editam fisierul de configurare al %<%-ului, si anume p3p.ini.
Desc)idem Edi$ !h!.ini si efectuam modificarile urmatoare+
5. dis!/a@\errors>Off se sc)im!a n dis!/a@\errors>On
?. activati extensiile de care avetm nevoie stergand !nc$ Hi vir(/e 4 din fata extensiei
si verificand daca extensia
@. 4e3$ension>!h!\(dQ.d// .. devine e3$ension>!h!\(dQ.d// (fr ;)
F. 4e3$ension>!h!\#&s$rin(.d// devine e3$ension>!h!\#&s$rin(.d// (fr ;)
I. 4e3$ension>!h!\#i#e\#a(ic.d// devine e3$ension>!h!\#i#e\#a(ic.d//(fr ;)
5BN
K. 4e3$ension>!h!\#@s^/.d// devine e3$ension>!h!\#@s^/.d//(fr ;)
L. re(is$er\(/o&a/s > off devine re(is$er\(/o&a/s > on )se schi#&a off in on*
%rin lasarea in executie a lui -inLam# se creaza server-ul cu numele C/oca/hos$E8 numai din
acest server se #ot lansa fiserele #)# sau fisiere )tml ce contin secvente de cod #)#.
$n directorul CF se creaza un director cu numele A!acheQ. $n acest director se afla
su!directorul h$docs unde se vor stoca toate fisierele cu extensia #)# sau )tml. 'cesta este
local)ost-ul nostru.
%entru a #utea vedea configuratia #)#, realizam un fisier cu extensia c.#)#, in care #unem
codul+
45p3p
p3pin,o(#6
57
Lansam fisierul din !ro-ser astfel' 3ttp'88local3ost8.y.p3p
%e ecran se va afi(a
55B
9oti"ni introd"ctive
6rice scri#t %<% se incadreaza intre marca*ele
;X
X<
sau
;X!h!
X<
1i#arirea #e dis#la= se #oate face in doua moduri si anume folosind +
5. functia echoC 1E_1 C
?. functia !rin$f)*
0cri#t-ul %<% #oate fi introdus intr-un fisier )tml sau se #oate crea un fisier direct cu
extensia #)#.
Li#&a6/ "%"
5. 6rice varia!ila in %<% ince#e cu #articular `.
?. "onstantele se introduce cu functia define )Cn#e\cons$an$a8 va/oare\cons$an$a*4
@. 6#eratorul de concatenare siruri este !nc$/ ).*4
F. 6#eratorii %<% sunt la fel ca si cei din lim!a*ul Dava0cri#t, Dava sau "YY;
I. $nstructiunile %<% sunt la fel ca si cele din lim!a*ul Dava0cri#t, Dava sau "YY;
K. Legatura in fisierul <1ML cu un fisier %<% se face #rin atri!utul ac$ion din tag-ul
for#;
0nc$ii/e #a$e#a$ice
"a si in celelate lim!a*e exista o serie de functii matematice. 4numeram cateva dintre
acestea+
a!s(numar) returneaza modulul numarului
sin(x), cos(x), tan(x) : argumentul x este in radiani
#o-(x,=) : returneaza x
=
cu o!servatia ca x tre!uie sa fie un real #ozitiv
log5B(x), log(x) : returneaza logarit)m in !aza 5B, res#ective logarit)m in !aza e
max(x5, x?,X,xn) , min(x5, x?, x@X.xn) returneaza maximul res#ective mminimul
dintr-un sir de numere;
ceil(x) : returneaza cel mai mare intreg mai mare sau egal cu x
round(x) : returneaza intregul rezultat #rin rotun*irea lui x
floor(x) : returneaza cel mai mare intreg mai mic sau egal cu x
rand(min, max)- returneaza o valoare aleatoare intre valorile intregi min si max
#i() : returneaza numarul #i;
sErt() : returneaza radacina #atrata a lui x
555
0nc$ii/e !en$r !re/crarea sirri/or de carac$ere
"a si in celelate lim!a*e exista o serie de functii #entru #relucrarea sirurilor. 4numeram
cateva dintre acestea+
strlen(sir) : returneaza lungimea sirului;
stro#s(sir5, sir?, j#ozCstartk) : verifica daca sir5 este su!sir a lui sir?, daca da afiseaza
#ozitia de ince#ut a acestuia.
j#ozCstartk este o#tional si verifica de unde sa inceda#a cautarea, im#licit are valoarea
zero;
0trstr(jsir5, sir?k) : returneaza sir5 din #ozitia in care a fost gasit sir?;
0trcm#(sir5, sir?) : com#arare lexicografica (alfa!etica) si returneaza valoarea zero,
daca sir59sir?, returneaza valoarea To daca sir 5Tsir?, returneaza valoarea So daca
sir 5 S sir?
Dec/ararea de vec$ori
$n %<% vectorii nu se declara. 0e lucreaza cu vectorii la fel ca si in Dava0cri#t . 4xista insa
aici #osi!ilitatea de a utilize indici sir de caractere.
Ins$rc$ini si fnc$ii !en$r /cr/ c vec$ori
$nstructiunea foreach )n\vec$or as n\indice><n\varia&i/a* : #ermite #arcurgerea
unui vector cu numele n-vector, cu varia!ila de ciclare n-indice, in care citirea se
face in variavila n-variabila.
functia crren$)vec$or* : returneaza valoarea retinuta de elemental din vector
as=u#ra caruia se gaseste #ointer-ul;
functia .e=(vector) : returneaza indicele elementului din vector asu#ra caruia se
gaseste #ointer-ul;
functia next(vector) : de#laseaza #ointer-ul #e elemental urmator din vector si
returneaza valoarea retinuta de acesta;
functia #rev(vector) - de#laseaza #ointer-ul #e elemental anterior al vector si
returneaza valoarea retinuta de acesta;
55?
A!/ica$ie co#!/e3e $i/izand /i#&a6/ "%"8 2avaScri!$8 si %1ML
A!/ica$ia -
55@
"odul sursa #entru a#licatia 5
S)tmlT
S!od=T
0'L,1 S!rTS!rT
Sl#)#
ec)otest test test 84m,L1'1 ;
pa9@;
p!9K;
prezultat9paYp!;
ec)o (S!rT rezultat9.prezultat.S!rT);
ec)o (prezultat.S!rT);
pnume9informatica;
ec)o (pnume);
lT
S!rTS!TSfont color9redTD47$/$84' D4 "6/01'/14 ", 7,/"1$'
D47$/4SJfontTSJ!T
S!rT
Sl
define(const5, @.KLI);
ec)o (const5 9 .const5) ;
lT
S!rTS!rT Sfont color9greenT 0$8 "'8'"1484 SJfontTS!rT
Sl
px9I;
ec)o ( x 9 .px.S!rT);
p=90$8,L M4, S!8T;
ec)o strlen(p=);
ec)o S!rTS!rT %6m$1$4 M4 9;
ec)o (str#os(p=,M4));
ec)o S!rT "6M%'8'84 S!rT;
ec)o strcm#(mama,mama);
px9p=;
ec)o ( S!rTx 9 .px.S!rT);
ec)o ( = 9 .p=);
ec)o S!rTS!rT "'8'"1484 M$"$ 9;
ec)o strtolo-er(p=);
55F
lT
S!rTS!rTSfont color9greenT "6/2480$$ SJfontTS!rT
Sl
p=955.L;
ec)o ( = 9 .p=.S!rT);
px9(int) p=;
ec)o ( x 9 .px.S!rT);
lT
S!rT Sfont color9redT 7'"168$'LSJfontTS!rT
Sl
function fact(pn)
Vif (pn99B) return 5;
else return pncfact(pn-5);
W
ec)o (7'"1(L)9.fact(L).S!rT);
#rint (7'"1@9 .fact(@));
pa9KI;
p!9LM;
#rint ( S!rTa 9.pa. S!rT !9.p!);
lT
SJ!od=T
SJ)tmlT
55I
A!/ica$ia QF '#licatia este formata din doua fisiere +
5. formular.)tml
?. formular.#)#
4xecutia si codul celor doua fiere este dat mai *os.
55K
'#licatie @ + 2alidare cam# /,M4
55L
:I:LI$-%0)I&
5. . /010, aplica2ii ', L.0ngeorzan, "-tin Lucian 'ldea, Mi)ai 8. Dumitru, 4d.
$nfomar.et, >ra(ov, ?BB5, $0>/ NL@-M?BF-5F-@.
?. 'HTML prin e)emple., 1udor 3ugoiu, 4d. 1eora, ?BB5, $0>/ NL@ ?B BFII A
@. G1e)nologii &4>H, 0a!in "orneliu >uraga, Matrix 8om, >ucuresti ?BB5,nr. %g. KK?,
$0>/ NL@ KMI ?M
F. '30S4C C,M56T*7 SC4*+C* and *+8L4SH $or CH*M*ST79 T*0CH*7S.,
L.0ngeorzan , 6ana 1atu, 4ditura ,niv. 1ransilvania, ?BB?, $0>/ + NL@-K@I-BKK-I.
I. ':eb 7esources $or Teaching and Studying *nglish; 0n 4ntroduction to HTML <.=.,
L.0ngeorzan, 6ana 1atu, 'drian 1atu, "ommenius %rogramme, ML5KB-"%-5C?BBB-
5-86."6M4/$,0 : "@5, 4d. ,niv.1ransilvania,?BB@ , $0>/ NL@-K@I-?BM-B
K. ',ptimizarea paginilor :*3., "alin $oan 'cu , 4d.%olirim, ?BB@.
L. >4nitiere in ?esign., 8o!in &illiams, 4d. "orint, ?BB@
M. 'Tehnologii internet., L.0ngeorzan, "-tin Lucian 'ldea, 4d. ,niv. 1ransilvania,
?BB@, $0>/ NL@-K@I-5LK-N.
N. '?esign pentru :*3., 8o!in &illiams, 4d. "orint, ?BB@, $0>/ NL@ KI@ F?5 N.
5B. '8ra$ic pe calculator !/010 " teorie @i aplica2ii 'A, L.0ngeorzan, Da.a! ainga,, 4d.
,niv 1ransilvania, ?BBK, $0>/ :NL@-K@I-L5@-N, $0>/ : NLM-NL@-I@I-L5@-M
55. 'Crearea si programarea paginilor :*3., 1udor 0orin, 2lad <utanu, ed. LZ0
0671, ?BBK, $0>/ NL@ MKB?? ? A.
55M
$. "onsideraii generale #rivind $nternet (i &orld &ide &e!...................................................5
>ro-sere &4>......................................................................................................................?
%rimii #asi catre constructia unui site....................................................................................@
$$. %rinci#ii de !aza in design....................................................................................................I
'liniere..................................................................................................................................I
%roximitatea ..........................................................................................................................L
8e#etitia.................................................................................................................................N
"ontrastul.............................................................................................................................5B
$$$ <1ML (<=#er 1ext Mar.u# Language).............................................................................5@
"rearea unui document <1ML............................................................................................5F
1'3-uri <1ML...................................................................................................................5I
1ag-uri din cadrul documentului <1ML.........................................................................5K
"ulori, fonturi, margini....................................................................................................5K
"uloarea de fond..........................................................................................................5K
"uloare #entru tag-ul !od=..........................................................................................5L
"uloarea textului..........................................................................................................5L
'tri!ute multi#le..........................................................................................................5M
1extul de !az (!asefont).............................................................................................5N
Marginile #aginii &e!.................................................................................................5N
0tilurile !locurilor de text............................................................................................?B
0tiluri logice.................................................................................................................?F
"onfigurarea fonturilor....................................................................................................?I
"uloarea fontului.........................................................................................................?I
7amilia fontului............................................................................................................?K
Mrimea fontului.........................................................................................................?L
3rosimea unui font......................................................................................................?M
>locuri de texte............................................................................................................?M
>locul #reformatat.......................................................................................................@B
>locuri #aragraf (tag-ul S#T)......................................................................................@5
>locuri de titlu.............................................................................................................@?
Linii orizontale.............................................................................................................@?
1a!ele...............................................................................................................................@@
%recizarea culorilor de fond #entru un ta!el................................................................@K
Dimensionarea unui ta!el............................................................................................@N
$magini.............................................................................................................................@N
'linierea unei imagini n #agina &e!.........................................................................FB
'linierea textului n *urul unei imagini........................................................................F5
$maginea #entru fondul unei #agini &e!.....................................................................F@
$magini ca legaturi.......................................................................................................F@
Legaturi(Lin.-uri)............................................................................................................FF
'legerea ntre dou #agini...........................................................................................FF
Lin. catre un site..........................................................................................................FI
'ncor aflat n alt document......................................................................................FL
6 #agin nou ntr-o fereastr nou.............................................................................FL
0ta!ilirea culorilor #entru legturi...............................................................................FM
7ormulare.........................................................................................................................FM
Des#re formulare.........................................................................................................FM
1ag-ul Sform T.............................................................................................................FM
55N
1ag-ul Sin#utT+............................................................................................................FN
Liste de selectie SselectT So#tion TX. SJselectT.................................................IB
Lista de selectie cu selectii multi#le............................................................................I5
"am#uri de editare multi#le.........................................................................................I5
<arti de imagini...............................................................................................................I@
4venimentele OonfocusH si Oon!lurH................................................................................IF
8eguli "00 ( 7oi de stil in cascada).........................................................................................IK
0tructura unei reguli "00.....................................................................................................IK
"lass ca selector...............................................................................................................IL
$D ca selector...................................................................................................................IM
0intaxa #entru definirea unui element $D este urmtoarea+ ............................................IM
"omentarii........................................................................................................................IM
%seudo-clase (i #seudo-elemente.....................................................................................IM
%seudo-clasa anc)or.........................................................................................................IM
%seudo-elemente..............................................................................................................IM
%recedena regulilor.........................................................................................................IN
0tiluri in-line................................................................................................................IN
0tiluri definite n fi(iere externe..........................................................................................IN
'tri!ute "00....................................................................................................................KB
7ont..............................................................................................................................KB
>ac.ground (i culoare..................................................................................................K5
1ext..............................................................................................................................K5
Distana dintre rnduri.................................................................................................K5
0tiluri #entru diferite medii..............................................................................................K5
"onfigurarea !locurilor de text........................................................................................K?
Limea c)enarului.......................................................................................................K@
4xem#lificam utilizarea regulilor "00 +..............................................................................KF
Dava0cri#t.................................................................................................................................L?
"arateristici ale lim!a*ului Dava0cri#t.................................................................................L?
Lim!a*ul Dava0cri#t.............................................................................................................L?
1i#uri de date si varia!ile................................................................................................L?
$nstructiuni.......................................................................................................................L@
7unctii #redefinite............................................................................................................L@
Legatura intre lim!a*ul Dava0cri#t si elementele dintr-un formular................................LI
4vent)andler....................................................................................................................LL
6!iecte.............................................................................................................................LN
6!iectul -indo-..........................................................................................................LN
6!iectul location..........................................................................................................M?
6!iectul document ......................................................................................................M@
6!iectul forms.............................................................................................................MF
6!iectul image ............................................................................................................MI
6!iectul date ...............................................................................................................MK
6!iectul navigator .......................................................................................................MK
6!iectul la=ers : (all-) ................................................................................................ML
6!iectul Mat). ............................................................................................................N5
6!iectul 'rra= ............................................................................................................N5
6!iectul 0tring.............................................................................................................N?
'nimatii.......................................................................................................................NF
5?B
'#licatie com#lexe utilizand lim!a*ul Dava0cri#t..........................................................NI
Lim!a*ul %<%.........................................................................................................................5BN
%rimii #asi .........................................................................................................................5BN
/otiuni introductive...........................................................................................................555
Lim!a*ul %<% ................................................................................................................555
7unctiile matematice......................................................................................................555
7unctiile #entru #relucrarea sirurilor de caractere.........................................................55?
Declararea de vectori.....................................................................................................55?
$nstructiuni si functii #entru lucrul cu vectori............................................................55?
'#licatie com#lexe utilizand lim!a*ul %<%, Dava0cri#t, si <1ML..............................55@
>$>L$638'7$4....................................................................................................................55M
5?5