Curs Web

Curs Programare WEB
Curs 1
Elemente de baza
Pentru inceput sa descoperim originea abrevierii HTML - Hypertext Markup
Language . Acest limbaj este folosit pentru a formata si preenta documente pe !eb .
HTML adauga tag-uri fisierelor A"#$$ astfel incat sa permita afisarea unei varietati de
fonturi % imagini sau sunete prin definirea unor elemente ca &eader % lista % paragrap&
si prin implementarea si utiliarea unor legaturi ' linkuri ( catre alte documente
publicate in internet .
Mai clar % limbajul HTML este limbajul pe care il inteleg aplicatiile de tip bro!ser
' ex) $nternet *xplorer % +etscape #ommunicator % ,pera % etc. ( folosite pentru a
naviga pe internet . -atorita acestui limbaj bro!ser-ul poate afisa ceea ce autorul
paginii !eb a dorit sa preinte .
*lementele de baa ale limbajului HTML sunt foarte simple si usor de retinut si apoi
de utiliat . cunoscand doar tag-urile de baa putem construi un intreg site fara
probleme .
TA/ 0 repreinta o comanda in cod HTML care indica modul in care va fi interpretata
informatia la care ea se refera .
TAG-uri DE BAZA
,rice pagina !eb standard trebuie sa contina 1 tag-uri de baa . Aceste tag-uri trebuie
sa apara in cadrul fiecarei pagini a unui !eb site .
Aceste tag-uri sunt preentate mai jos si ele trebuie sa apara exact in aceasta
cronologie in cadrul paginii !eb )
2HTML3
2H*A-3
2T$TL*3
24T$TL*3
24H*A-3
25,-63
245,-63
24HTML3
$nainte de a explica fiecare tag in parte mentione ca tag-urile trebuie scrise in codul
sursa exact in forma in care ele apar mai sus % intre semnele 23 . Aceste simboluri au
menirea de a transmite bro!ser-ului ca textul dintre ele trebuie recunoscut ca un tag 0
deci ca un cuvant c&eie al limbajului % o comanda care trebuie executata . Limbajul
HTML nu tine cont de litere mari sau mici in cadrul tag-ului % astfel incat 25,-63
sau 2body3 vor fi interpretate identic .
<HTML> 7 acest tag transmite bro!ser-ului ca documentul respectiv este de fapt un
document HTML % dand astfel indicatii asupra modului in care vor fi interpretate
diferite partitii ale fisierului A"#$$ .
<HEAD> 7 acest tag este in fapt tot un mesaj catre bro!ser % continand informatii
despre document 0 ca de ex. link-uri sau pagini care trebuie incarcate in prealabil .
<TITLE> 7 acest tag este folosit pentru a da o denumire paginii !eb create . acest
nume va apare in partea superioara a fereastrei bro!ser-ului identificand astfel pagina
respectiva .
<TITLE> 7 acest tag este de fapt inc&iderea celui precedent . transmite bro!ser-ului
ca textul ce trebuie considerat ca titlu al paginii s-a inc&eiat . Majoritatea tag-urilor
HTML folosesc tag-uri corespondente de inc&idere .
<HEAD> 7 tag-ul de inc&idere al tag-ului corespondent 2H*A-3
<B!D"> 7 acest tag semnaleaa desc&iderea sectiunii corespunatoare corpului
paginii !eb . Aici se vor introduce informatiile continute in pagina % textul % grafica si
elementele multimedia dorite .
<B!D"> 7 tag-ul de inc&idere care transmite bro!ser-ului ca nu se mai doreste
adaugarea de informatie in aceasta pagina .
<HTML> 7 acest tag inc&eie documentul HTML % semnaland bro!ser-ului ca nu
mai exista elemente care trebuie citite sau incarcate .
#u elementele preentate mai sus putem deja crea o pagina !eb 0 foarte simpla dar
perfect functionala 8
#odul urmator implementeaa o pagina !eb folosind doar tag-urile de baa )
2&tml3
2&ead3
2title3Pagina mea proprie24title3
24&ead3
2body3
Aceasta este o pagina de test . Acesta este un exemplu perfect pentru simplitatea
crearii unei pagini !eb 8
24body3
24&tml3
!B# $ -upa cum ati vaut tag-urile sunt folosite in general in perec&i complementare
. -aca vreti sa folositi taguri grupate fara a avea probleme atunci ele trebuie corect
grupate si nu incrucisate. Adica)
2Tag932Tag:324Tag9324Tag:3 - tag-uri incrucisate care pot genera erori.
2TA/932TA/:324TA/:324TA/93 - tag-uri grupate corect.
,data creata o prima pagina !eb functionala trebuie sa revenim la tag-uri pentru a
aprofunda capacitatile acestora .
$n cadrul sectiunii 25,-63 apar elementele de text si grafica ale paginii noastre .
Acum sa vedem ce altceva mai putem realia in aceasta sectiune .
;nul dintre elementele cele mai puternice si des utiliate care se intalnesc in cadrul
acestei sectiuni este controlul asupra culorilor % atat la nivel de text cat si de fond .
Putem configura culori diferite pentru text normal % link-uri % link-uri viitate % link-uri
active sau pentru fondul paginii noastre .
Pentru a specifica culoarea de fond tag-ul nostru se preinta astfel )
25ody bgcolor<=blue=3
#omanda anterioara face ca fondul paginii noastre sa devina albastru .
Pentru a specifica o anumita culoare ' ex. negru ( si pentru textul din cadrul paginii
folosim urmatoarea comanda )
25ody bgcolor<=blue= text<=black=3
La pasul urmator vom sc&imba culoarea link-urilor preente in pagina in galben
pentru a le diferentia mai rapid in cadrul informatiilor preentate in pagina !eb )
25ody bgcolor<=blue= text<=black= link<=yello!=3
$n caul in care in cadrul paginii avem mai multe link-uri ar fi util sa putem observa
rapid care dintre ele au fost deja viitate si care nu . Pentru a putea sublinia acest fapt
vom introduce si atributul vlink ' < visited link ( in cadrul tag-ului )
25ody bgcolor<=blue= text<=black= link<=yello!= vlink<=red=3
$n urma comenii de mai sus bro!ser-ul va afisa link-urile viitate cu rosu . #a un alt
pas putem configura o alta culoare ' ex. verde ( pentru link-urile pe care se apasa la
momentul respectiv . aceasta culoare va apare doar in momentul in care se va da click
pe link-ul respectiv iar atributul folosit va fi alink ' < active link ( )
25ody bgcolor<=blue= text<=black= link<=yello!= vlink<=red= alink<=green=3
>evenind la controlul culorilor trebuie sa mai amintesc unele detalii . #uloarea poate
fi specificata fie in limba englea ' denumirile dintr-o lista standard ( fie in cod
&exaecimal ' ex .?@@@@AA ( . Aormatul in care se transmite comanda este de tip >/5
' red green blue ( ) >>//55 . comanda de mai jos )
25ody bgcolor<=?@@@@AA=3
este ec&ivalenta cu )
25ody bgcolor<=blue=3
$n caul in care vrem ca pagina sa aiba un aspect mai personaliat putem folosi ca
fond nu doar o culoare ci o imagine ' in format /$A sau BP/ ( )
25ody background<=imagine.gif= text<=black= link<=yello!= vlink<=red=
alink<=green=3
Tag-ul anterior specifica utiliarea imaginii Cimagine.gifD ca fond al paginii noastre .
Trebuie mentionat ca indiferent de dimensiunile imaginii dorite aceasta va acoperi
intreaga suprafata a paginii .
$n continuare vom aborda utiliarea diferitelor fonturi . $n computer vom intalni o
varietate foarte mare de fonturi in ceea ce priveste forma si marimea . Trebuie sa
acordam atentie alegerii fontului utiliat in pagina noastra !eb pentru ca este posibil
ca nu toti utiliatorii care vor incerca sa accesee pagina vor dispune de fontul
respectiv . $n acest ca computerul va inlocui automat fontul nostru cu fontul default
al acelui sistem ' de obicei A>$AL sau T$M*" +*E >,MA+ ( .
#a element practic % indiferent de fontul pe care il utiliam este necesara viualiarea
paginii si folosind fonturile default cele mai raspandite .
Pentru a controla fonturile trebuie utiliat tag-ul <%!&T> % in cadrul sectiunii
25,-63 )
25ody bgcolor<=blue= text<=black= link<=yello!= vlink<=red= alink<=green=3
2Aont face<=arial=3
24Aont3
245ody3
,bservati ca si tag-ul 2A,+T3 necesita un tag de inc&idere . Acest tag ne permite sa
stabilim tipul de font % dimensiunea sa si culoarea % ca in exemplul urmator )
2Aont face<=#omic "ans M"= sie<=F= color<=green=3
Pentru a da flexibilitate utiliarii fonturilor limbajul HTML permite enumerarea in
cadrul unei liste a fonturilor ce urmeaa a fi folosite % astfel incat in caul in care
fontul pe care il utiliati nu este disponibil atunci se va incerca automat utiliarea
urmatorului font din lista )
2Aont face<=#omic "ans M"% Arial=3
Marimea fontului poate fi stabilita in cadrul a trei tipuri de plaje ) de la 9 la G % de la -9
la -H si de la I9 la IF .
$n afara acestui control al fonturilor mai exista inca sase tag-uri care pot modifica
fontul preent in pagina . Aceste comeni sunt tag-uri independente si nu apar in
cadrul tag-ului 2A,+T3 . Aceste tag-uri sunt 2&9 3 % 2&:3 % 2&H3 % 2&F3 % 2&J3 si
2&K3 % cu tag-ul 2&93 folosind dimensiunea cea mai mare de font iar 2&K3 cea mai
mica dimensiune . Aceste tag-uri sunt in general folosite la inceputul paginii pentru a
anunta un titlu sau in cadrul paginii pentru a diferentia dimensiunea unei portiuni de
text de dimensiunea standard definita prin tag-ul 2A,+T3 . Toate aceste tag-uri
necesita si complementarul de inc&idere ' ex. 24&93 ( .
$n caul in care nu se apeleaa la tag-ul 2A,+T3 se va folosi dimensiunea default de
H .
$n caul in care dorim ca in locul fontului default al bro!serului sa folosim alt font
pentru intregul document se va apela la tag-ul BA#E%!&T % integrat in sectiunea
H*A- a documentului )
2&ead3
2basefont face<D#omic "ans M"D color<=red= sie<DIHD3
24&ead3
#odul sursa de mai sus implica utiliarea ca default a noului font % cu culoarea rosie si
cu o dimensiune mai mare cu H decat a fontului default al bro!serului .
, alta observatie trebuie facuta legat de anumite caractere speciale care nu pot fi
utiliate in mod normal ca text datorita faptului ca ele repreinta cuvinte c&eie ale
limbajului HTML . Pentru a introduce aceste caractere exista posibilitatea de a folosi
codul lor sau alte definitii standardiate ale acestora 0 ca de exemplu pentru a obtine
semnul de copyrig&t )
Lcopy -3 bro!ser-ul va afisa pe ecran semnul de copyrig&t .
$n general simbolul CLD marc&eaa pentru bro!ser faptul ca incepem descrierea unui
caracter special .
;nul dintre cele mai folosite caractere speciale pentru HTML este spatiul 8 $n caul in
care in textul pe care dorim sa-l publicam in pagina noastra lasam un numar de J
spatii intre doua cuvinte bro!ser-ul va afisa doar un singur spatiu intre ele . Pentru a
putea afisa mai multe spatii trebuie introdus caracterul special Lnbsp )
2body bgcolor<=?AAAAAA=3
#evaLnbsp.Lnbsp.Lnbsp.Lnbsp.Lnbsp.Lnbsp.Lnbsp.Lnbsp.
tareLnbsp.Lnbsp.Lnbsp.Lnbsp.Lnbsp.Lnbsp.Lnbsp.Lnbsp.
ciudat.
24body3
>eultatul acestei comeni va fi )
#eva tare ciudat.
Alte caractere speciale des utiliate ar include )
Lnbsp. ' spatiu (
Llt. ' 2 (
Lgt. ' 3 (
Lamp. ' L (
LMuot. ' = (
>ecapituland % pana in acest moment am vaut cum se poate crea o pagina utiliand
tag-urile de baa ) 2HTML3% 2Head3% 2Title3% 24Title3% 24Head3% 25ody3% 245ody3%
24HTML3 . am aflat cum sa controlam culoarea folosita pentru fodul paginii % text %
linkuri % linkuri active % linkuri viitate % cum sa folosim o imagine ca fond al paginii si
cum sa configuram fontul folosit in ceea ce priveste tipul % culoarea si dimensiunea .
$n continuare vom aborda alte tag-uri care aduc o imbunatatire controlului pe care il
avem asupra continutului si preentarii paginii noastre )
 s' 7 tag-urile transforma textul din cadrul sau in text bold ' ingrosat ( . $n
locul acestei perec&i de tag-uri se poate folosi si perec&ea s' 
<'> s' <'> 7 tag-urile transforma textul din cadrul sau in text italic ' cursiv ( . $n locul
acestei perec&i de tag-uri se poate folosi si perec&ea s' 
 s' 7 tag-urile transforma textul din cadrul sau in text subliniat ' underlined (
<su(> s' <su(> 7 tag-urile transforma textul in superscript
 s' 7 tag-urile transforma textul in subscript
<s> s' <s> 7 tag-urile transforma textul in strike . $n locul acestei perec&i de tag-uri
se poate folosi perec&ea <str')e> si <str')e>
<(> 7 tag-ul comanda trecerea la un alt paragraf in cadrul paginii . mai exact tag-ul
comanda trecerea la linie noua si lasarea unei linii libere . Mai trebuie mentionat ca
folosirea in serie a tag-ului )
2p3 2p3 2p3
nu va duce la lasarea libera a trei linii % bro!ser-ul va interpreta tag-urile ca pe unul
singur .
Aolosit sub aceasta forma tag-ul nu necesita si complementarul de inc&idere . Nom
vedea imediat ca in caul folosirii unor atribute ale tag-ului va apare si necesitatea
utiliarii tag-ului complementar de inc&idere <(>
$n cadrul tag-ului 2p3 se pot folosi atribute pentru alinierea textului la stanga
' poitionarea default ( % la dreapta sau central .
-e exemplu )
2p align<=rig&t=3Acest text va fi aliniat la dreapta.24p3
va produce )
Acest text va fi aliniat la dreapta
 7 tag-ul comanda trecerea la linie noua fara a incepe un nou paragraf ' < line
break ( . nu necesita tag de inc&idere .
$n caul in dorim trecerea la o linie noua este obligatorie folosirea tag-ului % simpla
utiliare a tastei *+T*> in cadrul codului sursa al paginii noastre nu are nici un efect
in cadrul bro!ser-ului .
Pentru obtinerea mai multor linii libere se foloseste combinatia intre caracterul special
pentru spatiu si tag-ul 2br3 )
25,-6 5/#,L,><=?AAAAAA=3
#eva tare25>3
Lnbsp.25>3
Lnbsp.25>3
Lnbsp.25>3
Lnbsp.25>3
Lnbsp.25>3
#iudat.
245,-63
"ecventa de mai sus va duce la urmatorul reultat in bro!ser )
#eva tare

#iudat.
<BL!C*+,!TE> s' <BL!C*+,!TE> 7 va pagina textul dintre tag-uri ca pe
un citat . mai explicit bro!ser-ul va crea o margine libera in stanga si in dreapta
textului )
25,-6 5/#,L,><=?AAAAAA=3
25L,#OP;,T*3
Text folosit pentru a ilustra capacitatile diferitelor taguri HTML . Textul va fi folosit
pentru a ilustra paginarea cu ajutorul tagului 5L,#OP;,T* si apoi cu ajutorul
tagului de centrare a textului in cadrul liniilor .
245L,#OP;,T*3
245,-63
"ecventa de mai sus va avea ca reultat urmatoarea paginare )
Text folosit pentru a ilustra capacitatile diferitelor taguri HTML . Textul va fi
folosit pentru a ilustra paginarea cu ajutorul tagului 5L,#OP;,T* si apoi su
ajutorul tagului de centrare a textului in cadrul liniilor .
$n caul in care s-ar folosi tag-ul 2center3 )
2center3
pentru a ilustra paginarea cu ajutorul tagului 5L,#OP;,T* si apoi su ajutorul
24center3
s-ar obtine urmatoarea paginare )
pentru a ilustra paginarea cu ajutorul tagului 5L,#OP;,T* si apoi su ajutorul
<nb> 7 ' < non breaking space ( comanda introducerea unui spatiu in cadrul textului
fara a duce la trecerea la alta linie . +u se foloseste pentru introducerea unui spatiu in
cadrul textului ci pentru a distanta imagini aflate pe aceeasi linie . +u necesita tag de
inc&idere .
<-enter> s' <-enter> 7 tag-urile centrea textul dintre ele la nivel de linie .
!B# $ Tag-urile de formatare a textului pot fi folosite si combinat pentru a obtine
efectul dorit )
2center32b32i32u3$ kno! &o! to use HTML tags824u324i324b324center3
<.r> 7 '< &oriontal rule ( este un tag foarte folosit in cadrul paginilor !eb .
#omanda duce la trasarea unei linii oriontale de-a lungul paginii . Acest tag poate
primi mai multe atribute ce pot configura poitia % culoare % dimensiunea liniei .
<BODY BGCOLOR="#FFFFFF">
<HR WIDTH=50%>
<HR WIDTH=100>
</BODY>
Prima comanda va trasa o linie oriontala cu lungimea de J@Q din latimea paginii % de
culoare albastra si centrata . cea de-a doua instructiune va trasa o linie oriontala de
9@@ de pixeli . Tag-ul poate fi folosit si independent )
2&r3
ceea ce va duce la trasarea unei linii oriontale de lungul intregii pagini .
$n cadrul tag-ului 2H>3 se pot folosi si atributele AL$/+ % "$R* si +,"HA-* )
<HR WIDTH=60% ALIGN=RIGHT>
<HR WIDTH=60% SIZE=8>
<HR WIDTH=60% SIZE=15 NOSHADE>
A!"#$$% SIZE &''!(")* +!,-"('* %")"'" "*! NOSHADE .*/'
%")"* -* &'0")* -,%"&* 1
<P/E> s' <P/E> 7 dupa cum am aratat mai sus bro!ser-ul nu preinta pagina exact
sub forma sub care vedem textul in momentul realiarii codului sursa al paginii .
pentru acest neajuns exista o solutie sub forma utiliarii acestor tag-uri . "a luam
exemplu urmator )
23/
45 56
78888,OO8888496888888888887
3 L'':"'; 3
3 .,! 3
3 <!'-"&') 3
788888888888888888,OO888887
3993993
33 33
,,O O,,
</BODY>
A/'- /,& -$!-* 0* !'=$%* &$>* *."-*!' ") $!(*,*!'*
"(*+")' ?
ST4 'U U( I----o,,----'V(-----------I T LeeNie! T T for T T President T I-----------------
o,,-----I TVVTVVT TT TT oo, ,oo
"impla introducere a urmatorului cod sursa )
2P>*3
23/
45 56
78888,OO8888496888888888887
3 L'':"'; 3
3 .,! 3
3 <!'-"&') 3
788888888888888888,OO888887
3993993
33 33
,,O O,,
</<RE>
</BODY>
Na duce la afisarea urmatorului reultat )
23/
45 56
78888,OO8888496888888888887
3 L'':"'; 3
3 .,! 3
3 <!'-"&') 3
788888888888888888,OO888887
3993993
33 33
,,O O,,
IMAGINI
$maginea a devenit un element omnipreent in toate paginile !eb actuale . 5aat pe
faptul recunoscut ca o imagine are un impact mult mai mare asupra privitorului decat
un text precum si pe necesitatea oferirii unor informatii cat mai rapid si direct catre
utiliator imaginea s-a impus ca elementul indispensabil oricarei preentari a oricarui
subiect .
$n cadrul paginilor !eb introducerea elementelor grafice 0 la acest moment ne referim
la imaginile de tip /$A sau BP/ 0 se face cu ajutorul tag-ului <IM0> .
2$M/ ">#<=imagine.gif= E$-TH<1: H*$/HT<K13
are ca efect introducere imaginii imagine.gif in pagina noastra % cu dimensiunile
specificate in atributele E$-TH ' latime ( si H*$/HT ' inaltime ( ale tag-ului .
Atributul "># specifica sursa de unde bro!ser-ul va incarca imaginea respectiva .
aceasta locatie poate fi in sistemul respectiv ' in directorul paginii sau in orice alt
director ce va fi specificat in cale ( sau in orice alta locatie pe !eb ' ex.
&ttp)44ura.data.ro4lectii4poa9.gif ( .
$n caul in care nu se introduce o cale catre aceasta imagine ci doar numele ei atunci
bro!ser-ul va cauta in directorul curent al paginii !eb .
Atributele E$-TH si H*$/HT pot lipsi iar bro!ser-ul va recunoaste imaginea la
dimensiunile ei originale . c&iar in caul in care imaginea a fost special creat pe
dimensiunile necesare paginii noastre este de preferat folosirea celor doua atribute
care ajuta la incarcarea mai rapida a imaginii ' in ca contrar bro!ser-ul va mai pierde
timp calculand dimensiune si asearea in pagina a imaginii respective ( .
;n alt atribut care este preferabil sa fie preent este ALT . #u ajutorul acestui atribut
putem oferi o alternativa bro!ser-ului in caul in care imaginea respectiva nu a putut
fi incarcata )
2img src<=9.gif= !idt&<:@ &eig&t<:@ alt<=Text in caul lipsei poei din calea
generata=3
Tag-ul anterior va face ca in caul in care poa dorita nu este gasita bro!ser-ul sa
afisee textul atributului ALT intr-o fereastra de dimensiunile specificate pentru
imagine .
;n alt atribut al tag-ului $M/ este si 5,>-*> . cu ajutorul sau putem specifica
grosimea unui c&enar care inconjoara imaginea dorita .
Tag-ul $M/ accepta si el atributul AL$/+ % intalnit de exemplu si in cadrul tag-ului
2P3 .
25ody3
2img align<Drig&tD src<=9.gif= !idt&<:@ &eig&t<:@ alt<=Text in caul lipsei poei din
calea generata=3
Text care va apare alaturi de imagine neacoperind imaginea .
245,-63
#omanda anterioara va poitiona imaginea la dreapta liniei si va face ca textul sa
apara in stanga imaginii ' analog pentru folosirea atributului AL$/+<DleftD ( .
$n caul folosirii valorii #*+T*> pentru atributul AL$/+ se va obtine poitionare in
stanga a imaginii ' lucru default ( iar textul va incepe pe linia poitionata in dreptul
mijlocului imaginii % dupa umplerea acestei linii textul continuand pe linia urmatoare
de sub imagine 0 aceasta optiune este in general evitata .
Pentru a obtine centrarea imaginii se va apela la incadrarea tag-ului $M/ intre doua
taguri complemetare 2#*+T*>3 si 24#*+T*>3 .
Tot in cadrul atributului AL$/+ mai putem intalni alte trei valori )
CbottomD 0 aliniaa partea inferioara a imaginii pe linia curenta
CtopD 0 aliniaa partea superioara a imaginii cu cel mai inalt element de pe
linia curenta
CmiddleD 0 aliniaa mijlocul imaginii cu linia curenta
LINKURI
Mai intai sa vedem ce este un link ' sau o legatura ( . Pentru a fi cat mai simplu ) un
link repreinta cuvintele subliniate in cadrul unei pagini si pe care poti da click pentru
a naviga catre alte locatii .
Practic orice element al unei pagini !eb poate fi asociat unui link ) un text % o imagine
sau doar o portiune de imagine .
2a &ref<=&ttp)44!!!.ya&oo.com=36a&oo24a3
"ecventa anterioara repreinta introducerea unui link catre pagina 6a&oo .
<a> s' <a> 7 ' < anc&or ( tag-urile transmit bro!ser-ului faptul ca urmeaa definirea
unui link .
Adresa link-ului se incadreaa in &ref<D C . &ref vine de la Hypertext >eference si este
un atribut al tag-ului 2A3 . -upa inc&eierea tag-ului 2A3 urmeaa textul sau
imaginea care urmeaa sa faca legatura catre linkul dorit .
$n caul in care dorim realiarea unei legaturi catre o alta pagina din acelasi director
se va introduce in cadrul atributului &ref doar numele paginii )
2a &ref<=continut.&tm=3#ontinut24a3
;n alt tip comun de legatura este linkul in cadrul aceleiasi pagini . Pentru a crea un
astfel de link trebuie realiati doi pasi .
$n primul rand trebuie sa identificam sectiunea paginii unde vrem sa putem sari si apoi
sa realiam linkul .
Pentru primul pas 0 definirea onei la care dorim sa se faca legatura avem doua
posibilitati )
2a name<DdefinitieVonaD3 Text 24a3
sau
2p id<DdefinitieVonaD3 Text
Prima posibilitate este si cea mai corecta realiand o ancora legata de textul respectiv .
a doua posibilitate este de repreinta de fapt definirea unui paragraf % cu ajutorul unui
atribut al tag-ului 2p3 .
"altul propriu-is la aceasta ona definita se face prin intermediul urmatoarei linii de
cod )
2a &ref<=?definitieVona=3Acest link va duce inapoi la ona definita24a3
"altul se poate face si combinat 0 la o anumita ona definita in alta pagina % ca in
exemplul urmator )
2a &ref<=pagina:.&tml?definitieVona=3Acest link va duce inapoi la ona definita in
pagina :24a3
, alta intrebuintare foarte des intalnita a tag-ului 2a3 tine de inserarea in pagina !eb
a unei adrese de contact % mai exact o adresa de mail . ;rmatoarea linie de cod
realieaa exact acest lucru % cuvantul c&eie mailto specificand bro!ser-ului ca
urmeaa o adresa de mail iar acesta va lansa clientul de mail al viitatorului paginii cu
adresa adresaUya&oo.com gata introdusa in cadrul mesajului )
2a &ref<=mailto)adresaUya&oo.com=3"end *-Mail24a3
;n atribut folositor al tag-ului este si ";5B*#T % mail-ul trimis de viitator primind
astfel un subiect gata definit de dumneavoastra )
2a &ref<=mailto)adresaUya&oo.comWsubject<testare=3"end *-Mail24a3
Tot in problema linkurilor mai trebuie sa amintim si posibilitatea de a defini o adresa
de baa pentru linkurile din pagina noastra . $n mod normal pentru un link catre o
pagina din acelasi director se foloseste doar numele paginii . "a presupunem ca toate
linkurile din pagina noastra sunt catre pagini aflate intr-un acelasi director
-$>*#T,>V";>"* . in acest ca putem reduce textul presupus de introducerea
acestei cai in fiecare atribut H>*A in modul urmator )
2H*A-3
25A"* H>*A<&ttp)44!!!.site.com4directorVsurse3
24H*A-3
-upa utiliarea acestui cod sursa putem utilia in cadrul atributului H>*A doar
numele fisierului respectiv .
LISTE
Listele sunt un element foarte des intalnit in cadrul paginilor !eb datorita in principal
impactului viual mai ridicat decat al textului simplu .
$n general putem discuta despre doua tipuri de liste ) neordonate si ordonate . Listele
neordonate preinta elementele listei unul sub altul % cu un asa numitele bullet-uri la
stanga elementului . Listele ordonate inlocuiesc aceste bullet-uri cu numerale sau
litere in ordine crescatoare .
L$"T* +*,>-,+AT* )
2ul32li3*lement 9 2li3*lement : 2li3*lement H 24ul3
Aceasta comanda va duce la crearea unei liste neordonate )
*lement 9
*lement :
*lement H
Tag-ul 2;L3 poate folosi atributul T6P* 0 cu valorile "P;A>* % -$"# si #$>#L*
0 pentru a specifica formatul bullet-ului elementelor listei . Acelasi atribut T6P*
poate fi utiliat si in cadrul tag-ului 2L$3 pentru a specifica individual formatul bullet-
ului pentru fiecare element al listei in parte .

L$"T* ,>-,+AT*
2ol32li3*lement 92li3*lement :2li3*lement H 24ol3
Aceasta comanda va produce urmatoarea lista ordonata )
9. *lement 9
:. *lement :
H. *lement H
Tag-ul 2,L3 poseda doua atribute foarte folositoare ) "TA>T si T6P* .
Atributul "TA>T determina valoarea numarului de ordine al primului element din
lista . Atributul T6P* poate avea patru valori )
- a 7 pentru ordonare cu ajutorul literelor mici
- A 7 pentru ordonare cu ajutorul majusculelor
- $ 7 pentru ordonare cu ajutorul numeralelor romane majuscule
- $ 7 pentru ordonare cu ajutorul numeralelor romane minuscule
- 9 7 pentru ordonarea numerica ' default (
Tag-ul <LI> - care introduce un element al listei poseda si el un atribut extrem de
folositor ) NAL;* . cu ajutorul sau putem specifica o anumita valoare pentru numarul
de ordine al acelui element ' elementele urmatoare vor fi numarate incepand cu
aceasta noua valoare ( )
2,L3
2L$3 linia 9
2L$ value<DGD3 linia :
2L$3 linia H
24,L3
Na produce urmatorul efect )
9. linia 9
G. linia :
1. linia H
Tag-ul <LI> poate utilia si el atributul T6P* pentru a formata individual
numerotarea elementului respectiv al listei .
;n alt tip de lista intalnit destul de des este si tipul lista de definitie .
<DL>
<DT>T'!(') &' &'.")"
<DD>D'.")""* '!(')$%$"
</DL>
</BODY>
T*+8$% .,%,-" '-' <DL> 4 = &'.")"",) %"- 6 @ <DT> '-' $!(* &'
'!(')$% /' $!('*=* * ." &'.")" "*! <DD> ->'/"."/* &'.")""*
>!,>!"$8="-* * '!(')$%$" 1
OBS : I) %"(#*A$% HTBL '-' >'!("-* .,%,-"!'* comentariilor . acestea incep cu
28-- si se termina cu --3 . ,rice tag inserat intre marcajele de comentariu este ignorat de bro!ser .

Curs Web

Încărcat de

Drepturi de autor:

Formate disponibile

S-ar putea să vă placă și

Curs Web

Încărcat de

Informații document

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

Curs Web

Încărcat de

Drepturi de autor:

Formate disponibile

Curs Programare WEB

S-ar putea să vă placă și