Curs4_Imagini_si_Link_uri_harti_de_imagini.ppt

8/17/2019 Curs4_Imagini_si_Link_uri_harti_de_imagini.ppt

1/14

Imagini si Link-uriHărţi de imagini


2/14

Inserarea imaginilor în HTML

Eticheta pentru inserarea imaginilor într-un fişier HTML este. ceasta este o etichetă nepereche.

tri!utele lui "img# sunt$ %rc&locaţie şi nume fişier imagine 'este atribut obligatoriu( )idth&*al 'lăţime + nr. întregi po,iti*e sau *al. procentuale( Height&*al 'înălţime - nr. întregi po,iti*e sau *al. procentuale( *space&*al 'spaţiu la pe *erticală( Hspace&*al 'spaţiu în stnga şi dreapta imaginii( lt&te/t alternati*0 !order&*al 'chenar + implicit are *aloarea 1( align&*al 'left2 right2 top2 !ottom2 middle(

Modificarea doar unui atri!ut de dimensionare ')idth sau height(*a modifica imaginea proporţional. 3acă modificarea se face ptam!ele atri!ute2 apare riscul disproporţionării.


3/14

drese a!solute pentru %45

tri!utul src poate lua 6 tipuri de *alori$ drese - a!solute

- relati*e 'calea este descrisă relati* faţă dedirectorul curent în care se află fişierul HTML(

E/emple$ !solută$ src&http$77))).8ahoo.com7img7pic.gif 0

sausrc&5$9pictures9image.:pg0

4elati*ăsrc&img7pic.gif0src&..7..7img7pic.gif0

unde$ ..7 este director părinte 7 este director rădăcină

http://www.yahoo.com/img/pic.gifhttp://www.yahoo.com/img/pic.gifhttp://www.yahoo.com/img/pic.gifhttp://www.yahoo.com/img/pic.gif


4/14

tri!utul 5LE4 al etichetei "!r#

;entru a elimina te/tul din dreapta sau din stnga unei imaginialiniate pe ori,ontală se foloseşte trecerea la rnd nou "!r# dupăimagine2 cu atri!utul clear .


5/14

linierea imagininilor

;e ori,ontală 'align&left2right2center(;e *erticală 'top2middle2!ottom( linierea pe ori,ontală2 determină fi/area

imaginii în partea indicată de *aloareaatri!utului align. ;ermite alăturarea !locului dete/t2 sau alte o!iecte în partea opusă a

imaginii. linierea pe *erticală se face în raport cuelementele aflate pe acelaşi rnd cu imaginea.


6/14

>tili,area imaginilor în listeleneordonate;entru a particulari,a sim!olul grafic din

faţa unui element al listei neordonate seprocedea,ă în felul următor$"ul#

"img src&pic?.:pg0#Element ? lista"!r#

"img src&pic6.:pg0#Element 6 lista"!r#

@"7ul#


7/14

Link-uri

Aac posi!ilă na*igarea cu uşurinţă întreresursele Internet.

H8perlegăturile sunt folosite cu mai multescopuri$ ;entru conectarea paginilor HTML care fac parte

dintr-un site sau cu alte materiale din alte site-uri)e!

Bnglo!area unor fişiere de alt tip dect HTML într-un

site Cferirea informaţiilor adiţionale =a*igarea spre di*erse secţiuni în acelaşi fişier

HTML


8/14

%inta/a

Eticheta folosită pentru crearea link-urilor este …

tri!utele acesteia sunt$ href&legătură

name&nume ancoră target&locatie pt afişare 'numele ferestrei în care se *a încărca pagina( *alori$ Dself

D!lank Dparent

Dtop ;ot fi con*ertite în link-uri att linii de te/t ct şi

imagini. HREF poate primi ca *aloare fie o adresa a!solută2 fie

una relati*ă.


9/14

5ele situaţii în care se folosescLink-urile

?. =a*igarea între 6 fişiere HTML presupuneurmătoarea sinta/ă$"a href&fisierDdestinatie.html#te/t link"7a#

6. =a*igarea în cadrul aceleiaşi pagini presupune 6

etape$a. 3enumirea ,onei în care *rem să ne plase,e link-ul"a name&nume ,onă 'ancoră(0#secţiune document"7a#

!. 5onstruirea link-ului spre acea ,onă'ancoră($"a href&Fnume ,onă0#te/t link "7a#

. Link spre fişiere de tip non HTML$"a href&numefisier.e/tensie#te/t link"7a#


10/14

Legături la adrese de e-mail

3etermină deschiderea unei aplicaţiiclient e-mail 'e/. M.Cutlook( carepermite utilia,atorului să compunamesa:ul către adresa sta!ilită în link.

E/$

"a href&mailto$popescuGgmail.com0#%crie-mi

"7a#

mailto:[email protected]:[email protected]


11/14

Harţi de imagini

Hărţile de imagini permit declararea unor,one din imagine ca şi legături către altepagini )e!.

C imagine ce conţine mai multe link-uri.Includerea unor hărţi de imagini într-un

fişier HTML presupune 6 paşi$3efinirea hărţii de imagini plicarea hărţii asupra unei imagini


12/14

3efinirea hărţii de imagini

Tag-urile de definire a hărţilor de imagini este$..

Eticheta de deschidere map conţine o!ligatoriuatri!utul name&numeDhartă.

ona sau ,onele conţinute de imagine sunt introduseprin eticheta ..

tri!utele etichetei "area# sunt$ Shape- cu *alorile rect2 circ2 pol8

coords&lista de coordonate Href &legatura spre pagina aferentă ,onei alt &te/t alternati*0 target &fereastra în care se *a afişa conţinutul linkului0


13/14

3efinirea coordonatelor - coords

;entru *aloarea rect a atri!utului shape 5oords&/?28?2/62860 2 unde/?28? + coordonatele colţului stnga sus/6286 + coordonatele colţului dreapta :os

;entru *aloareacirc

a luishape

coords&/?28?2ra,a0 2 unde/?28? + coordonatele centrului cerculuira,a + lungimea ra,ei cercului

;entru *aloarea poly a atri!utului shape coords&/?28?2/62862/282...2/n28n0 2 unde

/?28? + coordonatele primul colţ0 al poligonului.../n28n + coordonatele ultimului colţ0 al poligonului


14/14

plicarea hărţii asupra unei imagini

;entru a lega o hartă de imagini definităde o anumită imagine2 în cadrul etichetei"img# se include atri!utulusemap=#nume_hart

Curs4_Imagini_si_Link_uri_harti_de_imagini.ppt

Documents

Transcript of Curs4_Imagini_si_Link_uri_harti_de_imagini.ppt