INSTITUTUL MULTIMEDIA ROMANO -ELVETIAN

SUPORT DE CURS DREAMWEAVER MX

REALIZATOR CURS: SEBASTIAN MEZEI

-DEVA-2006-

Macromedia Dreamweaver MX

Realizator curs: Sebastian Mezei

Lectia 1
1. INTERFATA DREAMWEAVER 1.1 1.2 1.3 1.4 1.5 1.6 1.7 1.8 Prezentarea aplicatiei Macromedia Dreamweaver MX Instalare, cerinte hardware si software Examinarea ferestrei de lucru Prezentare fereastra document Bara de inserari – Prezentare pictograme Bara de instrumente Bara de stare. Panouri si ferestre de inspectare Meniuri derulante. Meniuri contextuale. Obiecte invizibile

2. CREAREA UNEI PAGINI WEB 2.1 Stabilirea proprietatilor de pagina: text, titlu, culori 2.2 Preluarea unui text dintr-un fisier 2.3 Taguri 2.4 Formatare text 2.5 Separatoare de pagina 2.6 Salvarea paginii si previzualizare 2.7 Definire browsere 3. PLANIFICAREA UNUI PROIECT WEB 3.1 Definirea unui site Web 3.2 Utilizarea programului Wizard 3.3 Utilizarea panoului si ferestrei Site 3.4 Editarea unui site 3.5 Organizarea site-ului

Copyright 2006 : Institutul Multimedia Romano Elvetian

Macromedia Dreamweaver MX

Realizator curs: Sebastian Mezei

1 I NTERF AT A D R EAM WE AVE R 1.1 Prezentarea aplicatiei Mac romedia Dreamweaver MX
D re am w ea v er est e un edit or H T M L ( H y pert ex t Ma r k up La ng ua ge) , un i nst r u m e nt d e cr e a t ie, de dez v olt a r e a p a g inilo r W eb di na m ic e s i ins t r um e nt d e g est ion ar e a un ui s it e W eb. D re am w ea v er e st e un e dit or d e pa gin i W e b de t i p W Y SI W Y G ( w hat y ou s ee is w hat y ou g et – c e ea c e v ez i est e ce ea ce obt i i), f o ar t e p ut e rn ic si u sor de u t iliz at . D re am w ea v er est e un in st r um ent d e cr e at ie . C u a j ut or u l lui se pot i m p lem en t a gr up ur i de pa g ini car e sa i nc luda a n ima t ie s i ev enim e nt e. P ot f i cr eat e p a g ini W eb din am ic e pr in ut ili za r ea d e s cr ipt ur i de s er v er . 1 .2 C eri n t e h a rd wa re si s o ft w a re P ro ce sor I nt el P I I sa u ec hi va len t, 1 66 + MH z W ind ows 98 S E, 20 0 0, M e , N T, XP 12 8 MB R AM , m in im m inim 30 0 MB s pa t iu p e H D D Mon it or c u r ez ol ut ia 8 00 x 60 0, m ilio a ne de cu lor i Int er n et E x pl or er 4 .0 sa u m a i ma r e O p er a , N e t sca p e et c. 1 .3 Exa mi n a re a fe re s tr ei d e l u c ru L a d esch ide r ea Dr ea m we av er se obs er v a o s upra fat a a lba , goa la , d enu m it a “ f er ea st r a D oc um ent ”, car e v a a f isa pa gina W eb a sa cum v a a pa r ea ea i n br ow se r. In par t ea dr ea pt a s e ga se sc pa nour ile, car e v a pe rm it s a or ga niz at i s i sa v a m o dif ic at i e lem e nt ele pa gin ii W eb. 1 .4 Fe re a st r a Do c u me n t c o nt ine : • B ar a d e t it lu • B ar a d e m en iur i • B ar a d e in ser ar i • B ar a d e in st r um e nt e

Copyright 2006 : Institutul Multimedia Romano Elvetian

F or m s .sa blo a n e 8 . A c es t t it lu v a a par ea in ba ra de t it lu a br ow s er ul ui W eb. F r am es . C ha ra ct er s .t e xt 4 . nu m e le f is ier u lui s i t it lul pa gin ii W e b l a car e l ucra t i. T ex t . H ea d . L a y out .c om un 2 . T a b les .m a c het a 3 .t a be le 5 .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei Bara de inserari Bara de instrumente Fereastra document Bara de stare Fereastra de inspectare a proprietatilor Grupul de panouri B ar a d e t it lu c ont i ne nu m e le a plica t i ei. A pp lica t ion Copyright 2006 : Institutul Multimedia Romano Elvetian . S cr ip t – c od 1 2. M e dia 1 0.ca dr e 6 .). B ut oa ne le p ot f i u t i liz at e p r in t r a g er e p ent r u ins er a r e in pa g ina W e b. 1 . f or m u lar e et c .f orm ul ar e 7 . C om m o n . sa u pr in c lic k.5 B a ra d e i n s e r a ri e st e s it ua t a su b b ar a de m en iur i si c on t i ne but oa n e p ent r u ins er a r ea ele m e nt el or de pa gina W eb ( im a g ini . t a be le. T em pl at es . In ba ra de ins er a r i e x i st a 12 s ect iun i de ins er a r i: 1 .ca p 1 1.car ac t er e 9 .

1 . H T ML s i Ja va Scr i pt . D a ca a c ea st a n u es t e v iz ibi la . v er if icar ea lor d e p e s er v er si d in e xt er ior ul sa u.7 B ar a d e st a re E st e sit uat a in p ar t ea d e j o s a f er e st r e i D oc um ent s i co nt in e un s ele ct or d e t a gur i . B ut on ul R ef er e nc e s e ut il iz eaz a p ent r u a af la inf orm a t i i ce t i n de C SS ( C a s ca din g St y le S h eet s) . M e niu l F ile Ma na ge m e nt v a p er m it e sa e f ect ua t i c om enz i l ega t e d e g est ion ar ea f is ier e lor . Copyright 2006 : Institutul Multimedia Romano Elvetian . T a g ur ile pot f i p er ech e s a u s in gula r e s i se t er m ina int ot d ea una cu o di a go na la l a dr e a pt a / . St a n da r es t e viz ua liz ar ea c u ca re s e l ucr eaz a d e o bic ei. p ut e t i v e dea in f er ea st r a D ocu m e nt m od if icar ile ef e ct ua t e in co d. T a g ul e st e un t e xt in cl us int r e p ar a nt ez e u ng h iula r e < > s i m a r gin es c o bie ct e le pe o pa gin a W eb.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei In bar a de in ser ar i ex ist a o s ect iun e La y o ut . a t at co d ca t s i d es ign . Vizualizarea codului Vizualizare cod si design Titlul documentului Preview in Browser Butonul Reference Code Navigation Vizualizarea designului Vizualizare in timp real Meniul File management Reimprospatare Meniul View Options L a n ga but o a ne le d e v iz u a liz a re se af la o ca set a de t ex t u nde pu t et i int r o duc e t i t l ul pa gi nii W eb . s e cr ea za a nim at ii s i se a d a ug a di f er it e f u nct iona lit a t i pa gin ii W eb. se lec t at i c om a n da T ool bar din m en iul V i ew si a po i s ele ct a t i D oc um en t. v iz ua liz ar e d es ign (D e si gn V iew) si o v i z ua liz ar e co m u na . V iz ua li za r ea L a y ou t va p er m it e sa t r a sa t i elem e nt e d e t a bel dir ect in f er ea st r a D oc um ent . D a ca e f ect ua t i m o dif i ca r i in co d. M e niu l Pr ev ie w/ D e bu g in B r ow s er va aj u ta sa v iz ua liz at i pa g ina W eb in br ows er el e c onf i gur a t e. P an o u ri s i fe r e st r e d e i n sp e ct a re P r in a c est e a se st a bile sc pr opr iet a t i . P a n our i le din Dr ea m w ea v er s unt st r uc tur at e in g r upur i p e s ect iun i a la t ur i d e f er ea st r a D oc um ent . p r i n a pa s ar e a b ut on ulu i R e fr es h D e si gn. 1 . B ut on ul C ode N a v iga t ion est e a ct iv dor ca n d in ser a t i c od . ca r e v a pe r mit e sa v iz ua liz at i p a g ina in S t a nda r d wie w s a u L a y o ut v iew . P r im ele t r ei bu t oa n e d in st a nga s unt de st i nat e c om ut a r i i int r e v iz u a liz a re a c o d ( C od e V iew ) . P a n our i le pot f i ex t ins e sa u c om pr im at e pr in a ct ion ar ea sa get ii d e ex t ind er e s it u at a in st a ng a t it lu lui d e pa no u.6 B ar a d e i n s t ru m en t e est e cr e at a p en tr u a va o f er i pos ib ilit a t ea a c ce su lui r a pid la c om en z il e m a i im por t a nt e .

C o nt in ut ul m en iulu i de pin d e d e ob iect ul pe ca r e at i d at c lic . ce le a le im a g ini i. a ba r e i de sta r e s i a har t ilor d e i ma gin e. sa lv a r e. O b i ect e i n vi zi b i l e U nel e ob iect e car e s unt ins er at e in pa gin a W eb s un t pr oie ct a t e pe nt r u a nu f i v az ut e a t unci ca nd v iz ua l iza t i o p a g ina W e b. M en i u l E d i t c ont ine c om enz il e C ut . im por t s i e x p or t f isi er e. M en i u l M o d i fy e st e ut ili za t pen t r u m odi f ica r ea pr opr i et at i lor un ui o bie ct s e lect at la un m om ent da t. M en i u l Wi n d o ws est e ut iliz at p en t r u la ns ar ea p a no ur ilo r s i f er e str e lor d e i ns pect ar e Dr ea m w e v er . a e le m e nt elor in v iz ib ile. Ma i ex ist a si co me n z ile F ind si R epl ac e ( G as ir e s i I nlo cu ir e) si com a nda Pr ef er en ce s ( P r ef er in t e) . Copyright 2006 : Institutul Multimedia Romano Elvetian .dr ea pt a pe un o bie ct d in f er ea st r a Doc um ent . I n m om e nt ul s ele ct a r i i un ui t ext a pa r pr o pr ie ta t ile t ex t ulu i. M en i u l V i e w est e ut il iza t p entr u a ct iv ar ea si deza ct iv ar ea v iz ua liz ar ii c o nt inut ulu i s ect iun ii de a n t et . 1 . D in a ce st m e niu se poa t e a ct iva gr il a s i r ig la .u lui i n t ot a nsa m blu l lui . ia r la s e lect ar ea un ei im a g ini .8 M en i u ri d eru l a n t e M en i u l Fi l e co nt ine c om enz i d e de sc hi d er e . M en i u l Te xt es t e ut il iza t la ef ect ua r ea d e set ar i a s upr a t e xt u lui in tr o dus in p a g ina W e b. F er ea st r a P r op er t y poa t e f i e xt in sa pr in ut iliz ar ea pic t ogr a m e i d e ex t ind er e ( E x pa nd er ) . C op y si P ast e ( T a ier e. ast f el a v et i a c ces la t oa t e p ro pr iet at ile . A c es t ea c ur a ta co dul H T M L si c uv int el e din c od ul H T M L la im por t a re a u ne i pa gin i sa lva t e d in W or d. a st r a t ur ilor .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei P a n our i le pot f i sco as e din p a c het pr in a ct i ona r ea b ut on ul u i d e pr in der e d in st a n ga sa get i lor de ex t ind er e s i t r a g er ea lui din gr up ul de p a no ur i. D in ac est m en iu se p oa t e c on f igu r a o s c hema d e c ul or i sa u se p oat e la nsa Ma cr om e dia F ir ew or ks pe nt r u o pt im iz ar ea un ei im a g ini. s e pot a f isa i ma gin ile d e t r a sa r e. t a b ele l or si l im it e lor ca dr elor . C op ier e . A cest me niu co nt in e m ult e pr opr iet a t i ex i st e nt e i n f er ea st r a Pr o per t y . M en i u l C o mm an d s of er a com e nz i ut ile cu m ar f i C le a n u p H TML si C l ea n up W or d H T M L . M en i u l In s e rt cu pr in de c om e nz ile e x ist ent e in ba r a de ins er ar i. L ipir e) . M en i u l S i t e c ont i ne c o m e nz ile c or e sp un z at oar e sit e. M en i u ri co n t e xt u al e a pa r at un ci ca nd s e ef ect ue az a c lic. F e r e as t ra d e i n s p e c t ar e P ro p e rt y A cea st a f er ea st r a af i seaz a t oa t e pr o pr ie t at ile unu i ob iect se lect at la un m o m e nt dat .

Macromedia Dreamweaver MX

Realizator curs: Sebastian Mezei

P r in se lect ar e a c om e nz ii I nv is ible E lem en t s din m eni ul V iew a c es t ea po t f i v iz ua liza t e. 2. CREAREA UNEI PAGINI WEB

P ent r u a cr e a o p a g ina W e b nou a se lect at i din m eni ul F ile c om a nda N ew . V a a par ea o c as et a d e dia log N ew D oc um ent , d e un de p ut et i s el ect a t ipu l d e d oc um en t ca r e dor it i sa - l cr eat i. S e s ele ct eaz a ca t e gor ia B a sic P a ge si a po i t ip ul HT ML s i cl i c p e b ut on ul C r eat e .

In t ro du ce t i u n t ex t p ent r u c om e nz ilor d in f er ea str a Pr o per t y . p ent r u f or m at ar ea t e xt ulu i. F ie ca re d oc um en t no u cr ea t p ent r u a f i ga s it de ca t r e m ot oa r ele

a nt et , ca r e po at e f i c onf i gur a t c u aj ut or ul M en iul t ex t co nt in e t oat e co m enz ile nec esar e t r eb uie sa a iba st a bi lit u n t it lu car e est e ut il de ca ut ar e.

2 .1 S t ab i l i re a t i t l u l u i se poa t e f ac e in m a i m ult e m od ur i. D at i c lic- d r ea pt a p e o por t iun e li ber a di n f er ea st r a D o cum e nt s i s e lect at i P a g e P r oper t ies . D upa a c east a, v a a p ar e a o ca s et a d e d ia lo g Pa ge Pr op er t ies , int r o duc et i u n t it lu s ug est iv i n ca s et a T it le .

Copyright 2006 : Institutul Multimedia Romano Elvetian

Macromedia Dreamweaver MX

Realizator curs: Sebastian Mezei

A pa sa t i but o nul A ppl y sa u O K . T it lul pa gin ii v a f i a f isat in Dr e am w ea v er doa r a t unci ca n d d oc um ent u l no u cre at v a f i sa l va t . T ex t ul d e pe pa g ina e st e im plic it n egr u , cu loa r ea pu t a nd f i m od if ic at a in a c eea s i ca se t a de di a log P a g e P r o pert i es. S e pot se lect a d e as em en ea cu lor i pr o pr ii p ent r u hip er le ga t ur i. A l eg e re a cu l o ri l o r s e fa ce ut il iz a nd se lect or ul de cu loa r e in m a i m u lt e m o dur i, d in c ele ci nc i pa nour i dis po nib il e:

Copyright 2006 : Institutul Multimedia Romano Elvetian

Macromedia Dreamweaver MX

Realizator curs: Sebastian Mezei

- C olor cu bes – c ulor i c ubic e ; - C ont i nuo us t one – t o nur i con t inu e; - W in dows O S – pa n ou a c ce pt a t d e W ind ows; - Ma c O S – pa no u a cc ept at de Ma c int osh ; - G ra y sc a le – ga ma de gr iur i P ent r u a f i s igur a c a a t i a le s o cu loa r e v iz ib ila c or ect in or ic e br ow ser t r e bu ie sa se lec t at i n ea par a t S na p t o W eb Sa f e . C ulor i le m a i p ot f i int r od us e di re ct in ca set a de t ext pr i n v a lor i hex a z e cim a l e pr ec ed at e d e s em nu l # . V a lor ile s unt se lect at e RG B , pr im e l e do ua c ifr e r e pr ez in t a R – r os u, ur m a t oa r e le d ou a, r epr ez int a G – v er de s i u lt im e le d ou a r epr ez int a B – a lba st r u. In a ce la s i f e l est e st a b ilit a c ulo ar ea d e fu nd a l, ca r e a r e va l oa re a im p lic it a #F FF F F F , a lb a . T r ebu ie v er ifi ca t ca p a gi na sa f ie us or d e c it it , d a ca a pli ca t i o c ul oa r e de sc hisa d e f u nda l, est e r e com a nd a bi l sa set at i c ulo r i inc hi se pe nt r u t ex t . Ma r gin ile pa gin ii s unt se t at e in Pa ge Pr o pe rt ie s si ex ist a pat r u co nf ig ur ar i p ent r u m ar gin i. P e nt r u a put ea sa f i e v iz ua liz at a pa g ina W e b s im ila r in I E si N et sca pe t r ebu ie int r od usa a c ee as i v a loar e pe nt r u m ar g inea d e s us s i ina lt ime a m a r g inii . V a loar ea im plic it a p entr u m a r g inil e de pa g ina est e de 10 p ix e li f at a d e la t ur a d e s us s i 10 p ix e li p ent r u la t ur a din st a nga . 2 .2 In se r a r e a u n u i t e xt d i n t r- u n fi s i e r Et a p ele c op ier ii si in sera r ii unu i t e xt d int r - un pr o ce sor de t e xt sa u d in a lt pr ogr a m s un t :

Copyright 2006 : Institutul Multimedia Romano Elvetian

I n t ro du ce t i t r e i e l em en t e g . S ele ct a t i co m a nd a P as t e di n m eni ul Ed it sa u ut iliz at i com a n da ra pid a C TRL +V . A pa sa t i En t er pe nt r u a t r ec e la o lin ie n oua f. fat a de ce l pa ra gr a f car e est e p er e ch e. P ent r u cr ear ea un ei li st e neor dona t e pr oc eda t i in felu l ur m at or: a . C op iat i t e xt ul ( C T R L + C ) 4 . I nt r od uc et i t r ei ele m e nt e a pa sa nd t a st a Ent er dup a f ie ca r e e lem ent b . P ut et i cr e a m a i d ep a r t e o lista im br icat a. D es ch ide t i un d oc um en t 2 . N one – a nul eaz a or ic e st il de f or m a t ar e a pl ica t se ct i unii do r it e . Copyright 2006 : Institutul Multimedia Romano Elvetian . Da ca d or it i sa a l inia t i a ce as t a l ist a la n iv e l c u pr im a l ist a a pa sa t i O ut d ent din f er ea st r a d e i ns pect ar e Pr op er t y . 5 . 2 . pu nan d d oua ca r ac t er e d e r a nd n ou dup a b l oc. a st f e l: d . 2 . S u nt pa t r u op t iun i de ba z a in f orm at a r ea t e xt u lui: 1 . H ea d ing s 1. A p a sat i b ut on ul U n or der ed L ist din f er ea str a Pr op er t y . P la s at i c ur sor ul d upa ult im ul ele m e nt e .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei 1 . r es pe ct iv list a n eor d on at a s i list a or dona t a . C r ear ea u nui n ou pa r a gr af s e fa ce a p a sa n d t ast a E nt er sa u Ret ur n. H 1 e st e ce l ma i m ar e a nt et ca dim ensiu ne . i ar H 6 e st e ce l m a i m ic . S ele ct a t i in Dr e am w ea v er l oc ul u nde do rit i sa int r od uc et i t e xt ul . C re a r e a l i s t e l o r. S ele ct a t i ma i m u lt e p ar a gr a f e p ent r u v er if ica r ea m ent i ner ii f or m a t ar ii t e xt u lui 3 . S e lect at i a ce st e t re i el em en te s i a p as at i b ut on ul I nd en t d in f er ea st r a d e in sp ect ar e Pr op e r t y. P ar a gr a p h – a plic a s ect i uni i t a gur ile < p> </ p> . 2 .3 Tag u l Pa r ag ra p h si B re a k T a g ul P ar a gr a ph < p> in clu de i nt r e e le u n blo c d e t e xt .o p a g ina W eb put et i sa cr ea t i list e ne or do na t e si n um er ot a t e sa u or do na t e. a c est a v a a da ug a do ua r a nd ur i no i du pa s ect iu ne. A st f e l at i r ea liz at o list a s ub or do na t a ult im ulu i ele m e nt di n pr im a lis t a . 3 . In f er ea st r a de i ns pect ar e Pr op er t y s e g as es c b ut oa ne le U n or de r ed L ist si O r d er ed L i st . T ag u l B r a k < br > est e u n t a g sin g u lar . In g ener a l f o nt ul e s te C o ur ier d e 10 pu nct e . Ta gu l br ea k i ns er ea za un sin g ur c ar a ct er r a nd n ou in t ex t .4 Fo rm at a r e a t e xtu l u i F or m at a r e a t ext u lui in H T M L se f a ce ut il iza nd m e niu l d er ula nt F or m at d in f er ea st r a d e in sp ect ar e Pr op er t y .6 – a pli ca s ec t iun ii t a g ur i de a nt et . 4 . S e lect at i c ele t r ei e lem ent e c. In d en t a r e In t r. P r ef orm a tt e d – a f iseaz a t ex t u l in f o nt c u dim ensiu ne f ix a in f u nct i e d e s eta r ile sist em ulu i.

6 Pre vi zu al i z a r e a p ag i n i i i n b ro ws er Ma cr om e dia poat e d ef in i pa na la 20 d e br o wser e. P e nt r u a put e a f i f o los it e d e cat r e D re am w ea v er tr e bui e s a f ie inst a la t e a ce st e br ow s er e in ca l c ula t or . ht m l O P ER A – htt p : // w w w. c om/ w ind ow s / ie/ MO Z I L L A . S a u put et i folo si co ma nda H or iz ont a l R ule din m e niul In ser t . D a ca int r o du cet i o v a loar e p r oc ent u a la .m oz ill a . net sca p e. op er a. P ut et i de scar ca c at e va br ow s er e d e la a c es t e a dr es e de w e b: N ET S C AP E – ht t p : // ww w. ia r v iz i ta t or ul v a v ed ea ba r e or iz onta le da ca f er eas t r a br ow s er u lui e st e m a i m ica . a c ea st a nu s e v a r e dim en si ona . Copyright 2006 : Institutul Multimedia Romano Elvetian . ac ea st a se v a r e dim en si ona pr in m o dif ic ar ea f er e st r e i de br ow s er . din m e niu l F i le · S ele ct a t i com a nda Ed it B r ow ser · S e d es ch ide ca set a P re f er e nc es din Dr ea m w ea v er la cat e g or ia Pr ev ie w in B r o wser · D at i c lic pe b ut o nul + p ent r u a a da u ga un b r ow s er · S e r ep et a pr oc ed u r a p a na a d a u ga t i t o at e br ow s er e le d or it e. 2 . m i cr o so ft . D a ca lin ia or izo nt a la a r e o v a loar e a bs ol ut a in pix eli . c om IN T ERN ET E XP L O R E R – htt p : // ww w. c om P ent r u a in st a la br ows er ul d or it in Dr ea m w ea v er t r e bu ie s a e f ec t ua t i ur m a t or ii p as i: · S ele ct a t i com a nda P r e v iew in B r ow ser .5 S ep ar at o r d e p a g i n a P ut et i a d a ug a in pa gina W eb o lini e or i zo nt a la .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei 2 . da ca s e lect at i o bie ct u l lin i e or iz ont a la din t a b u l C o mm on ( c om un) a l b ar ei d e i nser ar e . or g/ d ow nl oa d.ht t p: / /w ww . cu r olu l de se pa r a t or .

Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei Copyright 2006 : Institutul Multimedia Romano Elvetian .

S ele ct a t i N ew S it e.ulu i de f init . Copyright 2006 : Institutul Multimedia Romano Elvetian .ulu i. D ef in e a S it e.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei 3. c ar e co nt in e pr ogra mu l w iz a r d d e def i nir e a u nu i sit e . se ct iu nea B as ic. PLANIFICAREA UNUI SITE WEB O r ic e sit e W e b a r e un dir ect or r a da c ina . P ent r u cr ear ea un or f is ier e noi sa u dir e ct oar e i n s it e f o los it i c om a n da N e w F i le s i N e w F o lder d in pa n oul S i t e .ul t r eb uie pa r cur s e c el e t r ei e t a p e a le p ro gr a m ul ui Wi z a rd : · E dit in g f il es – st a bil it i dir e ct or u l pr in ci pa l in c ar e v et i l ucr a la s it e · T est ing F il es – est e ut iliz at a doa r da ca sit e.u l f ol os es t e t eh no log ii de ser v er · S ha r i ng F ile s – st a b ilit i c um s e t r a nsf e r a f is ier e le c at r e un s er v er s a u a lt a l ocat ie pe nt r u a f i par t a j at e. c ar e e st e dir ect or u l in c ar e su nt sa lv at e t oa t e f isi er ele s it e. C an d inc e pet i l ucr u l la un s it e t r e bui e s a. A ce st ea v or f i cr eat e in d ir ect or ul r a da cin a a l si te. P ent r u a d ef in i si t e. In pa n ou l S it e e x ist a o leg at ur a . da t i cl ic p e ea si s e d es c hide ca s et a d e d ia lo g S it e de f ini t ion .l d e fi n i ti .

a t un ci ca nd s it e. N u e x i st a u n a num it m o de l de or ga niz ar e . Copyright 2006 : Institutul Multimedia Romano Elvetian .ul se va d ez v o lt a .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei P ent r u o f lu en t a m a i m ar e in lucr ul la un s it e W e b a c es t a t r e bu ie or ga niz a t . d up a c e c a pa t at i e x per ien t a in l ucr u l la s it eur i v a v et i st a bili un s is t em pr opr iu de or g a niza r e . Da ca t o a t e f i sier ele su nt scr ise la gr a ma da in di r e ct or ul r a d ac ina .u lui t r eb uie or ga niz a t e log ic p ent r u a put ea f i us or de co nt r ola t si d e m o dif ic at .l c ontr o lat i s i s a ef e c tu at i m o dif ic ar i in si t e. S ect iun ile s it e. v a f i f oar t e gr e u sa .

Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei CURS II HIPERLEGATURI. MODIFICARE Vizualizarea codului HTML Examinarea antetului si a corpului Editarea tagurilor cu Quick Tag Editor Stabilirea preferintelor de cod Curatarea codului HTML creat cu Microsoft Word AFISAREA IMAGINILOR IN PAGINA WEB Adaugarea unei imagini intr-o pagina Web Examinarea tipurilor de imagini Imagini de fundal Crearea efectului de rollover Alinierea unei imagini la text. Adaugarea de text alternativ Crearea de imagini legate Copyright 2006 : Institutul Multimedia Romano Elvetian . URL. LEGATURI LA E-MAIL Prezentare hiperlegaturi Cale absoluta si cale relativa Adaugarea de hiperlegaturi in pagina Utilizarea de ancore in pagini lungi Adaugarea de legaturi la un e-mail CODUL HTML – VIZUALIZARE. ANCORE.

A t r e ia par t e est e por t ul.ur i c ar e nu a u t r im it er e la u n n um e de fis ier .d isc . F is ier in a lt d ir ect or i ma gin i/ fot o1 . S ele ct a t i zo na u nde dor it i sa int r o duc et i im a g ine a dor it a.dis c s i da t i c lic p e b ut o nul S ele ct . ca r e d uc e la un n um e d e pa gin a i m pl icit . pe nt r u pa gin ile W e b sa u ft p . a ce st a n u v a m a i fun ct io na . A cin ce a p ar t e p oat e f i un s ir de int er o ga r e. P r im a par t e est e pr ot oc olu l. a pa sat i pi ct o gr am a B r ow s e. iar da ca s e af la in a lt d ir ect or t r eb ui e in tr o dus a ca lea cat r e d ir ect or ul r e s pect iv .j pg A d au g a re a u n e i h i p e rl e g at u ri i n p ag i n a P ent r u a p ut ea cr ea o hip er le gat ur a t r e bui e sa av et i in dir e ct or u l s it e. E x ist a UR L. A c est a incl ud e dir ect oa r ele si n um ele f is ier u lui 5 . de fa u lt . D a ca r e a liz at i o l eg at ur a la un f isi er z ip.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei H iper l ega t ur ile p er m it ut iliz at or ilor sa tr ea ca la a lt e s ect iuni d in pa gin a W e b c ur e nt a sa u la a lt e p a g ini W eb . 1 .di sc a ce st a v a a r at a a st f e l: File:///c/mywebsite/paginamea. de ex em plu . A leg et i im a g ine a d or it a d e pe ha r d. v iz it at or ii p ot v e dea c ont i nut u l dir ect or u lui W eb . br o wser u l v a s o lici t a sa s pu net i da ca dor it i sa sa lva t i f is ier ul pe har d. A pat r a p ar t e est e ca lea s i nu m e le d e f is ier . in l oc de o pa gin a W eb . I nt r od uc et i in p a g ina nou cr eat a un t e xt pr o pr iu s i a le g et i o z o na u nd e v e t i intr o duc e o im a g ine . d ar la inc ar c ar ea ei pe un s er v er W eb . ht m l. L ega t ura r ea li za ta ca t r e u n f isi er din a lt s it e est e o le ga t ur a a bs o lut a . D oar a n um it e f is ier e p ot f i af isa t e int r .dis c -u l Dv s . ca r e e st e se par a t de pr ot ocol p r in : / / 3 . car e p oat e f i ht t p . A do ua p ar t e est e dom e niu l. in de x . car e pr in a cc es ar e d uc e dir e ct la pa gin a dor it a .u lui W eb c el put in dou a pa gin i. de la n ga ca set a L i nk . D a ca nu ex i st a o pa gin a im plic it a .u l pr opr iu. C r eat i o pa gin a noua f olo sin d com a nda N e w d in m e niu l F ile .ht m l 2 . D eo ar ec e n u a v et i u n co nt r ol a l ce lui la lt s it e . pe nt r u le ga t ur a la un f i sier de p e u n s er v er ft p 2 .u n br ow s er. O a dr e sa UR L poa t e sa con t ina pa na la ci nc i sect i uni: 1 . A ces ta po at e f i: i nde x . c ar e e st e opt iona l s i im plic it e st e 80 4 . D a ca cr e at i o lega t ur a a bs olu t a la un f is ier ex ist e nt pe h ar d. ur ma t a de nu m e le f i sier ulu i. ca r e t r im it e d a t ele pen t r u a f i pr oc esat e de u n s cr ipt . sa u put et i rea liz a o hi per le g a t ur a la un f is ier de t ip i ma gin e. F is ier in a c ela si dir e ct or : o f er t a .ul W eb e st e crea t dint r . def a ult . ht m . S it e.un gr up d e ma i mu lt e p a g ini W eb ca r e s un t l ega t e in t r e el e pr i n hip er le gat ur i. D enum ir e a une i a dr es e W e b s e num e st e UR L ( U ni f or m Re sur c e L o ca t or ) – l oca liz a t or u nif or m de r e sur se. Mot iv ul est e p ent r u ca v iz it a t or ii nu a u a cce s la f is ier e le d e p e ha r d. ht m . C al e a ab s o l u t a s i re l a t i v a L a cr ear ea u ne i h iper l ega t ur i tr e bu ie int r od us a ca lea in pa gin a W e b. D a ca d or it i sa a cc esa t i un f is ier din a ce la s i dir e ct or . t r e bu ie int r od us d oa r n um ele f is ier u lui. A ce st l ucr u se po at e r e a liz a pr in d ou a ca i: a b so lut a si re la t iv a . Copyright 2006 : Institutul Multimedia Romano Elvetian . h t m l.html D a ca pr ev iz ua li za t i a ce ast a pa gina i n br ows er a c ea st a f u n ct io ne az a pe rf e ct . O ca le ra la t iv a la u n f is ier nu n ec es it a int r o duc er e a un ei a dr es e com p le t e si s e ut iliz ea za doar la hiper leg at ur i ca tr e f is ier e d in s it e. tr e bu ie u rm ar it da ca le ga t ur a r a m a ne v a li da. r e cu nos c ut de ca t r e s er v er ul W eb .

Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei D re am w ea v er v a i nt r odu ce o h iper leg at ur a r e la t iv a i n c as et a L in k. Copyright 2006 : Institutul Multimedia Romano Elvetian . d in m en iul In ser t . In loc ul u nde at i ins era t a nc or a cu n um e. P ent r u a r ea l iza o leg at ura la no ua a nc or a t r eb uie s a s ele ct a t i t ext u l la car e v et i fa ce leg at ur a . C r eat i o hip er le ga t u r a car e est e le gat a la a nc or a c u n um e. U t i l i z a re a d e A n c o re i n p ag i n i l u n g i A t unc i ca n d u n s it e W eb ar e m a i m ult e s ect iuni est e ut ila r ea liz a r ea d e h iper leg at ur i c u a j ut or u l A n cor e lor c u n um e. • In t ro du ce t i u n nu m e in ca set a de d ia lo g I nser t N am ed A n ch or si d at i cl ic p e b ut on ul O K . iar in ca set a L i nk i nt r od uc et i num e le a nc or ei pr ec ed at de se mn ul #. Et a p ele de re a liz a r e s unt ur m at o ar el e: • S ele ct a t i coma nd a N am ed A nc hor d in s ubm en iul I n v is ibl e Ta gs . P ent r u in ce pu t intr o duc et i o a n cor a c u nu m e la lo cu l in pa gi na un de v a f i d ep la sat v iz it at or u l. v a a par ea un e lem en t inv iz ib il c u o a nc or a pe e l.

m a i l C u a j ut or u l Dr e am w ea v er put et i sa i ns er at i in p a g ina o leg at ur a cca r e sa p er m it a v iz it at or u lui s a t r a n sm it a un e. MODIFICARE.ma il L ink . C od e s a u i n am be le v iz ua liz ar i. C od e V ie w – v iz ua li z ar ea co dul ui. S ing ur a p r obl em a est e.m a il d or it a si a pa sa t i O K . se r ea l iz eaz a da c a da t i c lic pe b ut o nul C od v iew . In t ro du ce t i a dr e sa de e.ma il. C u aj ut or ul lu i Dr ea mw ea v er put et i cur a t a a ut om at cod ul pr o dus pr in s a l var ea un ui d oc um en t W or d ca H TM L .VIZUALIZARE. Vizualizarea c odului HTML F er ea st r a Do c um ent din Dr ea m wea v er poa t e f i s et a t a as t f el inc at sa p ut et i v iz ua liza pa gin aW eb in m od D es ign . COD HTML. dat i c lic p e ob iect ul Em a il L i nk s i v a a par ea ca s et a In ser t E. S ele ct a t i t e xt u l ca r e ur m eaz a a f i le ga t la un e-m ail . car e i nf or m ea za de spr e v er siu nea d e H T ML f ol os it a de pa gin a. Copyright 2006 : Institutul Multimedia Romano Elvetian .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei L eg a tu ri l a u n e. In Dr e am w ea v er ex ist a m a i m ult e m od a lita t i de v iz ualiz ar e a c od ulu i H TM L . In pr im a lin ie de co d Dr ea m wea v er a da u ga a ut om a t u n va lid at or .m a il. ca a ce as t a le ga t ur a v a f u ncti ona do ar da ca ut iliz a t or ul a r e c onf igu ra t a o a pl ica t ie d e t ip e.

Dr ea mw e av er v a per m it e sa m od if icat i m o dul d e a f is ar e a co dul ui. a ce st l ucr u se r ea liz eaz a se lect a n d bu t onu l C o d a n d D esig n v iew s . p entr u a p ut ea v ed ea m od if ic ar ile t r e bui e sa a pa sa t i b ut on ul R efr es h. • S y nt a x C ol or i ng – e lem ent ele de c od s unt c olor a t e pe nt r u o m a i u so ar a ur m a r ir e. Da c a dor it i sa v iz ua l iza t i a t at pa gin a W e b ca t s i c odu l pa g ini i. r es pe ct iv < bod y> . O pt iun ile dis po ni bi le in m e niu l V ie w O pt io ns: • W or d wr a p – gr u pe az a lini ile de c od a st f e l i nca t sa nu m a i fie ne c esar a d er u lar ea pe or iz ont a la.o pa g ina W eb se r ega s est e in cor pul pa gi ni i. a c est ea n u se v or v ed ea im ed iat in f er ea st r a D o cum e nt . c o dul i n J a v a S cr ipt s i a lt e c odur i. • L i n e num b er s – a f i seaz a num ar ul d e lin i e. I n ca dr ul u ne i pa g ini W eb ex ist a do ua se ct iu ni d e ba z a : a nt et ul ( he a d) si c or p ul ( bo dy ) .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei P a g ina e st e inca dr a t a in int r e gim e d e t a gur ile < ht m l> . • H igh li ght i nv ali d H T ML – ev ide nt ia za co du l ca r e n u es t e v a li d. set ul d e ca r a ct er e car e t r eb uie ut iliz a t e d e br ow s er <m et a> . A t unc i ca n dr ea liz a t i m o dif ica r i in c od. A t unc i ca n d s un t et i i n m od ul C od . Copyright 2006 : Institutul Multimedia Romano Elvetian . A ce st ea s unt i nc a dr a t e de t a gur ile < h ea d> . • A ut o I n de nt – r ea liz ea z a ind ent a r ea a ut om a t a a co dul ui. I n a nt et s e r eg a s es c t i t l ul pa gin ii < t it le> . P ar t ea cea m a i i ns em na ta i nt r . P ent r u a v iz ua li za c ont in ut ul a nt et ul ui se lect at i com a nd a H ea d C ont e nt d in m e niul V iew .

Ma i put et i st a bili d a ca Dr ea mw e a v er va ut iliz a t a gur i <c en t er > sa u < div > c u a t r ibut u l a li gn “ c ent er ”. E di t T a g – ed it ar ea c ont in ut ul ui e x ist en t in t a g . a ce st luc r u s e po at e r e a liz a c u a j ut or u l Q ui ck Ta g Ed it or ( ed it or r a p id de t a g ur i) . Dr ea m w eav er v a evid ent ia a ce l c od in c ul oa r e a ga lbe na s i pu t et i sa a v e t i inf or m at ii pr ivin d m ot i v u l pen t r u ca r e t a g u l nu e st e v a lid si u ne le i n dic at ii pent r u r ez olv ar e . S ect iun ea B as ic ar e ur m a t oar e le p os ibil i t at i d e s et ar e: Copyright 2006 : Institutul Multimedia Romano Elvetian . Da ca ac est e o pt iu ni s un t dez a ct iv at e Dr e am w ea v er v a c ont inu a sa a f i sez e co d n ev a lid . dar s t a nd ar de le inc lina spr e u ti liz ar ea t a gu lui < d iv> . pu t et i sa lv a d oc um ent u l cr eat in W or d in f or m at H T M L . C od e C ol or s – c ulor i le cod ulu i 2 . P e nt r u a put e a c odu l co lor a t t r eb uie sa a v et i a ct i v a ta co lor a r ea si nt ax e i ( Sy nt a x C ol or ing ) din m e niul V iew O p t ions. P ent r u a c ur a t a a c est c od s upl im e nt a r . In ca t egor ia C o de F orm a t p ut et i st a b ili i n ce m o d v a cr ea D r ea m w ea v er c od ul. A cea st a co ma nd a l ans e az a ca set a d e dia log C l ea n u p W o rd H T M L . P ut et i st a b ili da c a t a gur ile v or lucr a cu l it er e m ar i s a u m ic i. W r a p Ta g – e dit a r ea u nui a lt t a g in j ur ul t a gulu i s lec t at . D re am w ea v er va perm it e sa s elect a t i inc lu siv o cu loa r e de f un da l pe nt r u v iz ua liza r ea c od ulu i . P ut et i f o los i cu lor il e im p lic it e di n dr ea mw e av er sa u v a p ut et i e dit a pr opr iile cu lor i in f un ct ie de pr ef er i nt e. D a ca s el e cta t i A ut om a ti c W r a ppi ng. s ing ur a pr ob lem a f iin d f a pt u l ca W or d cr ea za f oar t e m ult co d su pl im e nt ar pe nt r u a cr ea o p a g ina W e b.o pa gi na W eb . Dr ea m w ea v er v a i m par t i lin ia in f un ct ie de la t im ea co loa ne i int r o dus a i n ca m pul A ft er C o lum ns. T a gu l < ce nt er > e st e a c ce pt a t s i de v er s iun ile m a i v ec hi d e br ows er e. La s el ect ar ea p ict o gr a m e i. ca r e ar e d ou a s ect iun i: B a s ic si D et a il ed. C od e R ewr i t i ng ( r es cr ier ea co du lui) da po si bili t a t ea Dr eam w ea v er de a r ez olv a a nu m it e pr o ble m e a le co du lui a t un ci ca nd d es ch idet i pa gin a w e b. de a ici p ut et i s eta d im ens iu nea i nde nt a r ii . P ict ogr a ma a cest e i com e nz i o g a s it i in f er ea st r a d e ins pe ct a r e Pr op er t y s a u d in m eni ul M od if y.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei D a ca a t i int r o dus un c od nev a li d. D oc um ent u l sa lva t in W or d v a ar a t a a p rox i ma t iv la fe l c u c el in it ia l. C u rat a r e a c o d u l u i HT ML c r e at c u M i c ro s o ft Wo rd D a ca a v et i do cu m e nt e cr ea t e in W or d s i dor it i sa le int r od uc et i int r . S ta b i l i re a p re fe ri n te l o r d e c o d E x ist a t r e i ca t eg or ii d e pr e f er int e c ar e s e a plic a la c od H TM L : 1 . E d i t a re a t ag u ri l o r c u Q u i c k T ag Ed i t o r D a ca do r it i s a ca ut at i si s a e dit a t i r a pid u n t a g. d in m en iul C om ma nds . C od e For ma t – for m at a r ea c od ulu i 3 . S ele ct a t i t ipu l de doc um ent H TM L din l ist a si dat i c lic pe Edi t C olor ing S ch em e ( e dit a r ea s c hem ei de c ul oa r e) . C od e R ewri t i ng – r es cr ier ea c o dulu i T a g ur ile d in v iz ua li z ar e a C o de C o l or s a f is ea z a c ul oar ea st a bilit a pr in v a lor i le s eta t e in pr e f er int e le Dr ea m wea v er . d ar sta nd ar de le W 3C r e c om a nda ut i l iz ar ea lit er e lor m ic i pe nt r u t a g ur i. P ent r u a put ea f i cit it m a i usor un c od Dr ea mw e av er il ind ent e az a . t a gul a pa r e l a nga pic t og r am a Q uic k T a g Edi t or si a v et i la dis po z it ie t r ei m od ur i: In ser t – ins er a r ea u nu i co d H T ML in t a g. de sc hid et i pa gin a cr eat a cu w or d si d at i c om a n da C le a n u p W or d H T ML .

3 . A pp l y S o ur ce F or m a tt i n g – a plic a o pt iun ile d e f orm at a r e a c odu lui p e car e l e. 2 .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei 1 . S et B a ck gr ou nd C ol or – v a per m it e s pe ci f ica r ea c ul or ii de f u nda l a pa gi nii W eb .at i st a b ilit in ca t egor ia C ode F or ma t . S ho w L og O n C o m p let io n – af is e az a o ca set a de d ia lo g cu u n r ez um at a l m o dif ic ar ilor f ac ut e. C lea n U p <f ont > T a g s – i nla t ur a t a g ur il e < f ont >. t a g ur ile m et a s i t a gur ile de le ga t ur a din s ect iun ea a nt et . C ul oa r e a im pl i cit a est e a lb. F ix In va l i dl y N e st e d Ta gs – r ez o lva t a gu r ile n eim br icat e cor ect . p ar a gr a f e le g oa le s i m ar gin ile . 4 . A leg et i lo cu l un de dor it i sa ins er at i i ma gin ea Copyright 2006 : Institutul Multimedia Romano Elvetian . 5 . R em ov e Al l W or d S p ec ifi c M ar k u p – i nla t ur a t ot c od ul X ML di n t a g ul < ht m l> . C lea n U p C SS – inl at ur a st ilur ile C SS su plim ent ar e di n d oc um ent . s t ilur i C SS d in r a n du r i le s i c elu lele de t a be le s i st ilur i n ef o los it e. 7 . Dr ea mw e av er v a perm it e sa v iz ua liz a t i im a g ini le i nt r od us e i n p a gi na . ma i a le s p e c e le d e m ar car e a f ont u lui. in f er ea st r a D oc um ent . A FIS A REA I MA G IN IL O R IN PA G IN I W EB T oa t e im a gi nile d int r . P ent r u a in ser a o im a gin e in pa gina W eb t r e buie sa ef e ct u at i urm a tor ii pa si: 1 . # f ff f ff .o pa gin a W e b su nt f isi er e s ep ar at e s i nu f a c pa rt e d in p a g ina . 6 .

Mi ddl e – s e a lini az a e lem ent ul in m ij l oc ul im a g ini i. D at i c lic p e p ict o gr am a B r ow s e din f er ea str a de in sp ect ar e Pr op er t y si a le get i im a g ine a do r it a. In u lt im a per i oa d a se im p un e din c e in c e ma i m u lt s i f or m at ul P N G . A pa sa t i but o nu l S el ect . a lte lini i d e t ext gr upa t e s ub ima gin e 7 . A bs ol u t e B ott o m – e lem e nt ul c el m a i d e su s se a linia z a la p ar t ea d e j os a i ma gin ii 8 . P ut et i pr e v iz ua liz a im a gi nea da ca s el ect at i ca s et a d e v a li dar e Pr ev iew Im a g es 4 . P N G – in loc uie st e t r ept a t G IF . f oa rt e ut i l pe nt r u lucr u c u tr a ns pa r e nt a in i ma gin e. B r ow s er de fa u lt – a li nier e la linia de ba za . T ex t T op – a li nie r e a im a gi nii c u t e xt u l c el m a i de s us . pi ct o gr a m a d e le ga t ur a la un f i sier E xa m i n a r e a ti p u ri l o r d e i mag i n i E x ist a d oua f or m at e st a n da r d de im a gin e a cc ep t at e de br ow ser e: G IF s i J P EG . T op – a lini er ea im a g ini i la e le m e nt ul c el m a i de s us. A c est ef ect se num est e R o llo v er s i es t e d e f a pt o ima gin e c a r e se s upr a p une pe st e o a lt a im a g ine ca nd c ur s or ul m o us e. s el e ct a t i com a nda I ns er t I m a ge 3 . D upa in ser ar e pu t et i ef ect ua m od if ic ar i a s upr a im a ginii in c eea c e pr iv est e d im ens iu nea l or . B as eli ne – s e a lin i az a pa r t ea d e j os a im a g ini i l a pa r t ea d e j os a e le m e nt ulu i 3 . G IF – f or m at d e i m a g ine ut ila pe nt r u im a g ini c ar e au z on e d e c ulo ar e c o nt inu e. se le ct a t i < em pt y> d in m en iul d er ul a nt . E x ist a ma i m ult e p ro gr a m e car e va aj ut a s a opt im iz at i im a g inile p ent r u o d es car ca r e m a i b un a. O im a gin e r ol lov er se obt ine a st f el: Copyright 2006 : Institutul Multimedia Romano Elvetian . O pt iun ile dis po ni bi le s un t: 1 . c u a j ut or u l c ar uia a li ni a t i ob iec t ele de la n ga i ma gin i. In f er ea st r a de in sp ect ar e Pr o per t y s e ga se st e u n me niu der ula nt A lign . R i ght – im a g ine a a l i nia t a la dr ea pt a a lt or e lem ent e P ent r u int r od uc er ea u nu i t e xt a lt er nat i v la im a g ine t r eb uie sa f o los it i ca set a A lt t ex t din f er ea st r a d e ins pe ct a r e Pr op er t y . J P EG – f or m a t de im a gin e ut i liz at a p en tr u im a gin ile f ot ogr a f ic e.ul • S ele ct a t i o le ga t ur a d ej a ut iliz at a .f il e. ca r e e st e si f or ma t ul a cc ep t at s i ut ili za t d e c at r e Ma cr om e dia Fir ew or k s. i ar v iz it a t or ii v or de scar c a u n f is ier d e a c e ea s i d im e ns iun e. D in ba r a I ns er t . d e ac ee a e st e f oar t e i m p or t a nta a le ger ea i ma gin ii a st fel inc at s a f ie in con cor da n t a c u de s ignu l pa gin ii. P ut et i sa r ea l iz a t i un hip er lin k la o im a g ine ast f el: • In t ro du ce t i UR L . di m e ns iun ea f is ier u lui n u s e r e duc e. B ot t om – s e a lin ia z a e lem ent ul in pa rt ea d e j os a im a gin ii 6 .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei 2 . L ef t – im a gi nea a li nia ta la st a n ga a lt or e lem e nt e 9 . C re a r e a e fe ct u l u i d e Ro l l o v er D re am w ea v er v a aj ut a sa r ea liz at i ef e ct e d e im a g ine la t r e cere a m ous e. t ext u l s ub im a gine 5 .u lui p est e o im a gin e. P ut et i sa s et at i in pa gin a W e b o im a gi ne de f u nda l. lin iil e d e t ex t s unt gr upa t e s ub ima gin e 4 . in m en iul d er ul a nt L ink • U t iliz at i p oint. P r in m ic sor ar ea ima gi n ii in Dr eam w ea v er . dep ind e d e br o w ser 2 .u l dor it in c a s et a L ink a f er est r ei d e in sp ect ar e P r op er t y • U t iliz at i p ict o gr a m a B row se s i se lec t at i f i sier ul la ca r e d or it i s a e x ec ut a t i lin k .ulu i s e af l a de a s upr a im a g inii .t o. Da ca n u do rit i s a u n u est e ne c esar a i nt r od uc er ea unu i t ex t a lt er nat iv . Ac est ea s unt a seza t e in m oz a ic p e t oa t a s upr a f at a p a gi nii.

A pa r e c as et a d e dia log I ns er t R ollo v e r Im a ge .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei 1 . a st f e l im a g ini le se pr e inc ar c a in ca ch e. pr in c lic pe bu t oa n ele B r ow s e 5 . Copyright 2006 : Institutul Multimedia Romano Elvetian . V a li dat i ca s et a Pr e loa d R ollo v er Im a ge . l inii l e de t ex t v or f i s ub im a gi ne M i d d l e – a lini az a e lem en t u l in m ij l oc ul im a g inii . Adaugarea de text alternativ A lini er ea se r ef er a la m o du l in ca r e ob iect ele a p ar i n pr e aj m a un ei im a g ini. S ele ct a t i f isi er ele cu i ma gin ile. O pt iun ile de a lini er e s un t : B ro w s er De f au l t – a linia z a la lini a de b a za in f u nct i e de br ow ser B a se l i n e – a lin iaz a p ar t ea de j os a im a g inii la par t ea de j os a el em ent u lui T o p – a lin iaz a i ma g ine a l a el em ent u l de su s. Alinierea unei imagini la text. A da uga t i o le ga t ur a la im a gi nea r ollo v er 7 . c ea in i t ia la si c ea cu e f ec t ul r ol lov er . linii le d e t ex t su b im a g ine B o t to m – a lin iaz a e lem ent ul in pa rt e a d e j os ca s i B a se line T e xt To p – a linia z a im a g ine a c u t ex t ul c el m a i de su s A b so l u te B o t t o m – a lin iaz a pa rt e a de j os a e lem ent ulu i c el ma i d e su s la p ar t ea de j os a im a g ini i L e ft – a linia za im a g ine a la st a nga a lt or ele m e nt e R i g h t – a l inia z a im a gi nea la dr ea pt a a lt or e lem ent e C r est er ea d ist a nt ei di nt r e ima gin e si a lt e ele m e nt e din p a g ina s e f ac e pr in st a b ilir ea v a lor i lor dor it e p ent r u V S pa ce s i H S pa ce .ul br o wser ulu i 6 . Da t i u n num e im a gi nii in ca set a de su s 4 . P ent r u a a lini a o i m a gine t r ebu ie sa ut iliz at i u na din c om e nz ile d e a linie r e a t e xt u lui d in s ub m e niu l A li gn a l m eni ului T ex t . S ele ct a t i loc ul und e d or it i sa a par a im a gin ea r ollo v er 2 . D in ba r a I ns er t s ele cta t i ob iec t ul R ollo v er Im a g e 3 . D at i c lic pe b ut o nul O K .

Crearea de imagini legate In m om e nt ul in c ar e s e lect at i o ima gin e sa u un t e xt a par e pr opr i et at ea L ink in f er ea st r a d e in sp ect ar e Pr op er t y .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei In t ro du cer ea u nui t e xt a lt er na t i v s e fa c e d in c a st ea A l t t e xt .un c hen ar a t unci va t r eb ui sa dat i o v a l oar e pe nt r u B or der .f ile . Copyright 2006 : Institutul Multimedia Romano Elvetian . I nt r o duc et i U RL .t o. D a ca dor it i ca im a gin ea sa a pa r a int r .u l do rit de la t as t at ura sa u s e lect at i f is ier u l dor it cu aj ut or ul p ict o gr am ei poi nt . din f er ea str a d e i ns pect ar e Pr op er t y .

programe de redare Adaugarea fisierelor Flash Adaugarea de legaturi la un fisier PDF Adaugarea de legaturi la un fisier de sunet Inserarea unui applet Java GESTIONAREA COMPONENTELOR CU PANOUL ASSETS Prezentare componente Administrarea si examinarea componentelor in panoul Assets Adaugarea componentelor la o pagina Web Crearea de noi componente Copierea componentelor Assets Copyright 2006 : Institutul Multimedia Romano Elvetian . latime de banda. HARTI DE IMAGINI Adaugarea de legaturi la grafica folosind hartile de imagine Crearea unei harti de imagine Crearea si alinierea zonelor feirbinti Bare de navigare cu imagini rollover Bare de navigare cu legaturi ADAUGAREA FISIERELOR MULTIMEDIA Prezentare multimedia.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei CURS III BARA DE NAVIGARE.

sa l ega t i u n hot s pot la o a nc or a cu n um e d a c a i nt r od uc et i # s i nu me le a nc or ei . In t ro du ce t i link . put et i s a ef ect ua t i op er at iu ni d e a lini er e l a s t a n ga. B ut oa ne le im a g ine t re bu ie sa f ie r ea liz a te la a ce ea si d im ens iun e s i t r ebu ie sa r e pr ez in t e poz it i a in it ia la a b ut on ulu i ( u p) .o pa gin a put et i f olo si S h ift + cl ic p e z on ele f ier b int i p ent r u a le a da uga la se lect ie . In t ro du ce t i un t e xt a lt er na t iv i n c a s et a d e t e xt A lt T ex t. p ent r u st a re a o v er s i pe nt r u b ut o nul a pa sa t 4 . 5 .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei BARE DE NAVIGARE. 3 . s us sa u j os. 2 . S ele ct a t i f er e as t ra de dest ina t ie din m e niul der u lant Tar g et ( t int a ) . va t r e bui c a a ces t ea sa f i e a linia t e p ent r u un a sp ect uni f or m i n pa gin a W eb . D upa se le ct a re a l or . In ser at i o ima gin e in pa g ina W eb . d en um it e z on e f ier b int i sa u z one ht os po t s. c ar e su nt f oa r t e ut il e s i de ef e ct . 6 . In t ro du ce t i un n um e p entr u har t a de i m a gin e in ca set a de t ex t Ma p N a m e. S ele ct a t i un inst r um e nt d e de se na r e pe nt r u a t r a sa o z ona f i er bin t e.ul t r ec e d ea su pr a b ut on ulu i. A l i n i ere a zo n e l o r fi e rb i n t i D a ca a v et i d ef in it e m a i m ult e z o ne f i er bin t i a la t ura t e. la s el ect ar ea e i v or a pa r ea in f er e ast r a d e i ns pect ar e Pr op er t y p at r u i ns tr um e nt e p ent r u ha rt il e de im a g ine . Et a p el e r eal iz a r ii ba r ei d e na vi gar e su nt : 1 . 4 . pr in u t i liz ar ea su b m en iulu i A lig n d in m eni ul M od if y . r es pe ct iv Ma k e Sa m e W i dt h. B a re d e n avi g a re c u i m ag i n i Ro l l o v er si c u l eg a tu ri P ent r u r e a liza r e a un ei ba r e de na v igar e c u im a gi ni r ollo v er t r eb uie s a a v et i pr eg at it e in pr ea la b i l m en iul d or it si ca t e t r ei b ut oa ne im a g ine pen t r u f iec ar e lin k d in m en iu. P ent r u a s e lect a t oa t e z o nel e f ier bi nt i dintr . C re a r e a u n ei h a rt i d e i m ag i n e 1 . In t ro du ce t i num e le pr i m u lui b ut on 3 . A ce st e z on e s unt de f init e ca h ipe r l ega t ur i pe a num it e p or t iun i d int r . D upa c e at i s ele ct a t z ona dor it a . S ele ct a t i ob iect ul N a v i gat io n B a r din pa nou l O bj e ct 2 . A leg et i im a g ine a d or it a pent r u b ut o nul n ea pa sa t . dr ea pt a .u l d or it pent r u ac ea z ona d e i ma gin e.ul d or it in c a set a W h en C lick e d. D e as em en ea put et i sa set a t i a ce ea si in a lt im e sa u la t i m e cu a j ut or u l c om enz ii Ma k e Sam e H eig ht . sta r ea de a pa sa t (d ow n) s i st ar ea ( o v er ) ca nd m ou se. H ar t ile de im a gine su nt foa rt e ut ile a t unci ca n d d or it i s a r ea liz at i m en iur i gr af ic e. P ut e t i d e as em en ea . HARTI DE IMAGINI Adaugare a de legaturi la grafica folosind ha rtile de imagine H ar t ile d e im a g ine su nt z one dif er it e a l e un ei im a g ini .o i ma gin e. G o T o U R L Copyright 2006 : Institutul Multimedia Romano Elvetian . i nt r odu cet i UR L.

D at i c lic pe O K . 6 . pe nt r u a ar a t a im a gine a i nit ia la d e b ut on a pa s at . f is ier e le m ult im ed ia n ec es it a u n pr o gr am car e l ucr eaz a im pr e una c u br o w ser ul. Dr ea mw ea v er va p er m it e sa int r od uc et i in pa gin a W eb a num it e f un ct ii car e sa v er if ic e dac a v i z it a t or ul ar e un a n um it pr o gr a m d e Copyright 2006 : Institutul Multimedia Romano Elvetian . ia r a da uga r ea d e f i sier e m ult im ed ia i n pa gin ile W e b est e t ot m a i ut iliz a t a . 7 .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei 5 . E x ist a ma i m ult e t ipur i de f is ier e m u lt im edi a car e pot f i int r o du se int r . p ent r u o pr ei nc ar ca r e a i ma gin ilor . In p ar t ea de j o s a ca s et e i de d ia lo g I ns er t N a v iga t ion B a r a ve t i po sib ilit a t ea s e lect ar ii m od ulu i d e int r od uc er e i n pa gin a: or iz ont a l sa u v er t i ca l 8 . In u lt im a per ioa da p a g inile W e b s-a u dez v olt a t f oart e m ul t . S ele ct a t i ca s et a P r e loa d Im a g es. elem ent u l com u n est e ca in ge ner a l a c es t e f is ier e nec esit a o la t i me d e b a n da m a r e. ADAUGAREA FISIERELOR MULTIMEDIA P re zen t a re mu l t i m e d i a .o p a g ina W e b. L at i m e d e b a n d a. In t ro du ce t i a lt e but oa n e cu a j ut or u l bu t o nul ui plu s si p r i n r e pet ar ea p a s ilor a nt er i or i. B if at i ca set a d e v a li dar e Sh ow “D ow n Ima ge ” I nit ia lly . P ent r u a p ut ea f i r ula t e.

fa r a a m a i a p ela la a lt e a p lic at ii . st il u l. D in s ect iun ea M e dia a bar ei In ser t . I n ca set a de v a l ida r e din fer e as t r a Pr op er t y p ut et i s a st a bili t i m od ul d e r u lar e a f ilm ulu i: L o op ( r el uar e) si A ut op la y ( aut or e da r e) . Copyright 2006 : Institutul Multimedia Romano Elvetian . i n c as et a Sa v e A s 8 . D re am w ea v er le in t r o duc e a u t om at p e am a n dou a . P ut et i de a sem e ne a sa per m it a br ows er ulu i sa inc a r c e a ut om at un pr ogr a m d e r e dar e ( p la y er ) . a st f el inca t br ow s er u l sa p oa t a t r at a opt im f is ier u l F la sh . P r i m u l e st e r e cu no sc ut de c at r e br o wser ul I nt er ne t E x p lor er. In t ro du ce t i t ex t u l d or it in c a s et a T e xt 4 . In ca s eta de dia lo g I ns er t F la sh T ex t . d im ens iu nea si a lin ier ea t ex t ulu i 3 . Et a p el e r eal iz a r ii un ui o bi e ct F l as h c u t e xt : 1 . In ca set a d e t ex t L i n k in t r odu cet i UR L. A d au g a re a fi si e re l o r Fl as h P ent r u int r odu cer ea un ui f ilm F la s h se le ct a t i di n b ar a de i ns er ar e c om a nda In ser t F la s h. D re am w ea v er v a pe r mi t e sa r ea l iza t i f il m e F l a s h c u t ex t i n mo d di r ec t. T a g ur ile < obj ect > si < em be d> s unt f o los it e pe nt r u in ser ar ea un ui o bie ct F la sh. In t ro du ce t i num e le f ilm u lui F la s h cr ea t . D ac a d or it i s a pre v iz ua liz a t i f il m u l F la sh . D at i c lic pe O K . S t a bi lit i de st i nat ia hip er le ga t ur ii in ca se t a de t ex t T ar g et 6 . S ele ct a t i cu loa r ea de f u nd a l d or it a d in l i st a der u la nt a B g C olor 7 . s ele ct a t i f o nt u l.ul dor it 5 . t r e bu ie s a s e lect at i f il m u l si sa a pa sa t i but onu l P la y d in f er ea st r a d e in sp ect ar e P r op er t y . se le ct at i o bie ct u l F la sh 2 . ia r ult im u l d e ca tr e N et s ca pe.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei r e da re .

6. 7. P ent r u a p ut ea v iz ua li za f is ier e P DF t r ebu ie de sc arc at pr ogr a m ul de r edar e A do be Acr oba t R e a d er . P ent r u i nt r o duc er ea un ui b ut on Fl as h t r eb uie ex ec utat e ur m a t oa r el e co m e nz i: S ele ct a t i din sect i unea M e dia a ba r ei I ns ert o bie ct u l I ns er t F la s h B utt o n A pa r e ca s et a d e d ia lo g I ns er t F las h B ut t on S ele ct a t i un st il d e b ut on din lis t a St y le A da uga t i un t ext b ut on ulu i in ca m pu l B ut t o n T ex t S t a bi lit i t ip ul de f on t dor it s i di m e ns iun ea lui In t ro du ce t i un U R L. 2. A d au g a re a u n u i fis i e r d e s u n e t Copyright 2006 : Institutul Multimedia Romano Elvetian . a dob e. A d au g a re a d e l eg a t u ri l a u n fi si e r PD F F is ier e le PD F ( por t a ble d igit a l f or m at ) p er m it unu i v iz it a t o r sa v a da un f is ier e xa ct c um s. c om . 8. D a ca n u es te i nst a la t . C a sa intr o duc et i u n f is ier P D F t r eb uie sa cr ea t i o hi per le ga t ur a la ac el f is ier . 3. st i lul d e pa gin a s i gra f ica a par e xa ct c um a u f ost cr ea t e. D a ca ex ist a i ns ta la t mo dul ul p lug . 5. car e est e gr at u it s i s e ga se st e la a dr esa W e b : ht t p: / / ww w. a t u nc i f is ier u l se v a d esch id e in p a g ina . f is ier u l s e v a d es ch ide in A cr o bat R ea der in a f ar a br ows er ul ui. d ac a e st e ca z u l in c a set e le L in k s i Ta r get A da uga t i o c ulo ar e de f u nda l d in lis t a d er ul a nt a B g C olor D at i c lic pe O K .a dor it .in Acr oba t . 4. in dif er ent d ac a v iz i t at or u l ar e f o nt ur il e sa u n u.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei 1.

A leg et i lo cu l un de dor it i sa ins er at i f i sie r ul d e s une t 2 . In ca set a de d ia l og S ele ct F i le in tr o cd uc et i ca le a ca t r e f is ier u l de s un et . In t ro du ce t i p ar am et r ii cer ut i de do cu m e nt at ia a pp let . A d mi n i s t ra re co m p o n en t e.ul ui s e lect a n d b ut on ul P ar a m et er s 4 . Copyright 2006 : Institutul Multimedia Romano Elvetian . S ele ct a t i ob iect ul P lug .o pa gin a W eb : im a g ini. In s e r a re a u n u i ap p l et J a v a J a v a e st e u n lim ba j d e pr o gr a m ar e ut il iz at la cr ear ea de p r ogra m e den um it e a pp let . U R L . c ul or i. s un et e . f il m e.ur i. su nt ele m ent e de num it e a sse t s ( com pon en t e) . 3 .o in b ro wser . S ele ct a t i ob iec t ul A pp let d in se ct iu ne a M e dia a bar ei I ns er t . S a lv at i m od if ic ar ile si pr ev iz ua li za t i. In ser ar ea un ui a p pl et J a va se fa c e a st f e l: 1 . S e de sc hid e ca set a de dia log S el ect F ile . N av i ga t i in d ir e ct or ul car e co nt ine a p plet ul J av a s i s ele ct a t i f is ier ul dor it . T ot ce ea c e est e in cl us int r . S a lv at i p a g ina si pr ev iz ua liz a t i.ur i s i car e r u lea za in c a dr ul u nei f er est r e de br ow ser .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei D a ca dor it i sa ins er at i u n f is ier d e su n et i n pa gin a W e b ef ect ua t i ur ma t oar e le o per a t iun i: 1 . 2 .i n di n s ect i une a M e dia a ba r ei I n sert 3 . G E S TIO N A R EA C O M PO N EN TE L O R C U PA N O U L A S S ETS P re zen t a re . Dat i c lic pe bu t onu l S e lect 4 .

ul W eb .o pa gin a We b f oar t e si m p lu. P ent r u e lem ent ele din cat eg or ia F i lm ex ist a un bu t on pe nt r u P lay / St op in p ar t ea dr ea pt a su s a ecr a n ului de pr ev izu a liza r e din pa nou l A sse t s. C om po ne nt el e p ot f i a d a u ga t e int r . C ar e a f is ea z a o list a c u t oat e c om p one nt e le d in s it e.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei O r ga n iza r ea a c es t or el em ent e se fa c e cu aj ut or ul p ano ulu i A sset s.o a num i t a cat egor i e. Dr ea m w ea v er fa c e o sc a nar e a co pie i ca c he si ca t a log he az a a ut om at t oa t e c om po nent ele inc lus e in sit e. C at eg or iil e p a no ulu i A sse t s s unt : • Im a g ini • C ulor i • F ilm e F la s h • F ilm e S hock wa r e • U RL . d e a s em ene a p ot f i c op iat e com p one nt e din a lt s it e W eb de fi nit in Dr ea m w ea v er .ur i • F ilm e • S cr ip t ur i • Ma ch et e • B ibli ot ec a C om po nent ele pot f i pr e v iz ua liz a t e si se po at e na v ig a pr in c at e gor i ile d e c om p one nt e. A t unc i ca nd s el ect a t i un e lem en t d int r . . Categorii A d au g a re a d e co m p o n e n t e l a o p ag i o n a We b Et a p ele a da ugar ii u ne i com p on ent e su nt : Copyright 2006 : Institutul Multimedia Romano Elvetian . V iz u a li za r ea e le m e nt el or s e f a ce p e ca t e gor i i. s ele ct a nd but o nu l af e r ent f iec ar e i ca t eg or ii in p ar t e. in j u ma t at ea d e s us a pa n ou lui A s s et s a p ar e o pr ev iz ua l iz a r e a com p one nt e i r es pect iv e. L a d es c hider ea pa n ou lui A ss et s .

C om po nent ele no i v or f i dis po nib ile c hia r da ca nu a u f ost in ca ut ili za t e in s it eu l W eb.u l u nde dor it i s a c op iat i c om p one nt a . T ex t ul s e lect at v a f i s et a t in c ul oa r e a a lea sa .ul c ur ent . S ele ct a t i but onu l I ns er t . In ca z u l in car e dor it i sa co pia t i un gr u p de co m p one nt e . P ut et i s c him ba c ul oar e a un ui t ex t d in pa gin a web ut iliz a n d cu lor ile ex i st e nt e i n pa n oul A s set s. s e lect at i cu loa r ea dor it a s i a pa sa t i but onu l A ppl y . P la sa t i pun ct u l de i ns er ar e i n pa gin a W eb. C re a r e a s i co p i er e a c o mp o n en te l o r A s s e t s . t r e buie sa se lect at i c om p one nt el e c u S hift +c lic pe n um ele e le m e nt elor s i efe ct ua t i a ce lea si c om en zi ca s i la co pie r ea unu i s ingu r ele m e nt . P a n ou l A ss et s v a per m i t e sa c op iat i el em en t e din s it e. P a n ou l As s et s va a f is ea za c om pon en t ele dej a ex ist e nt e in s it e. D a ca dor it i sa c opi a t i o s in gur a co m p one nt a . s el ect at i cat eg or ia d or it a s i da t i cl ic dr ea pt a p entr u la nsa re a m en iul ui c ont e xt ua l.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei 1 .ul W e b. se lect at i c om po ne nt a d or it a. u nde dorit i sa i ns er at i c om po ne nt a a lea sa 4 . Copyright 2006 : Institutul Multimedia Romano Elvetian . m er get i la ca t eg or ia C olor s. S ele ct a t i co m p on ent a dor it a di n c a dr u l ca t eg or iei ale se 3 . P ent r u a cr ea o c om po nent a no ua t r e bu ie s a s el ect at i bu t on ul r a d i o F av or it e s d in pa r t e a d e su s a pa n ou lui As s et s. A leg et i o ca t egor ie 2 . dat i c lic. u n gr up d e e le m e nt e s a u un gr up d e f a vor it e in a lt s it e d ef in it in Dr ea m w ea v er . T r eb uie sa s ele cta t i t ex t ul dor i t.dr ea pt a si se le ct at i C op y t o S it e si se lect a t i sit e. dar p ut e t i cr e a c om pon ent e no i c ar e p ot f i u t iliz at e u lt er ior .

Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei CURS IV AFISAREA DATELOR IN TABELE Crearea unui tabel pentru date Adaugarea unui titlu de tabel Importul datelor in tabel Exportul datelor din tabel Utilizarea unui format predefinit de tabel in Dreamweaver PROIECTAREA MACHETELOR DE PAGINA Prezentare machetelor de pagina Utilizarea vizualizarii Layout Editarea unui tabel in vizualizare Standard Imbricarea unui tabel Transformarea tabelelor in straturi CONSTRUIREA CADRELOR SI A SETURILOR DE CADRE Prezentare cadrelor Crearea unui set de cadre Utilizarea panoului Frames Imbricarea cadrelor Stabilirea atributelor pentru cadre Utilizarea obiectelor de tip cadru Copyright 2006 : Institutul Multimedia Romano Elvetian .

Ma i p ut e t i se lect a la t im ea t a be lulu i s i gr os im ea ch ena r ulu i. 6 . D a ca t a b elu l co nt ine un H e a d er ( ca p de t a be l) . 5 . L oc ul in ca r e se a f is ea z a d en um ir ea t a b elu lui s e po at e s et a din m en iul d er u la nt A lign ca pt io n. In ca m p ul C a pt io n int r o du cet i un num e p ent r u t a be l. In ser ar ea un ui t a b el s e p oa t e r ea liz a a st f e l: 1 . S ele ct a t i pict og r am a Ta ble din ba ra Ins er t sa u c om an da Ta b le d in m e niul In ser t 3 . D at i c lic k pe O K . In t ro du ce t i v a lor ile d or it e la R ow s ( r a n dur i) si C o lum ns ( c o loa ne) . 7 . P la sa t i pun ct u l de in s er a r e in p a g ina W e b un de dor it i sa ins er at i t a be lul 2 . s ele cta t i poz it ia in c ar e d or it i sa f i e a f isa t a c es t a di n cam pul H ea der .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei AFISAREA DATELOR IN TABELE Crearea unui tabel pentru date In t ro du cer ea t eb ele lor i n s it e v a per m it e sa af is at i da t e le in m o d log ic in c o loa ne si r a n dur i si in a c el a s i t im p va per m it e sa co nt r ola t i l oc ul i n ca r e a par o bie ct e le in pa gin a. S ele ct a r ea ta be lulu i cr e at s e p oa t e fa c e i n m a i m ult e m o dur i : Copyright 2006 : Institutul Multimedia Romano Elvetian . 4 . Ma i p ut et i set a s pa t iul din t r e c elu le – C e ll s pa c ing si sp at iu l d int r e c o nt inut ul c elu lei si m ar g inile c elu lei – C ell pa d din g. 8 .

S ele ct a r ea un ei ce lule s e f a c e pr in cl ick in int er ior u l e i. D a t i cl ick int r .o c elu la s i se v a a f isa intr ea g a iera r hie d e t a gur i . P ut et i se lec t a gr u pur i d e ce llu le pr in a pa s ar ea S H IF T + cli ck sa u put et i se lect a c e llule se pa r at e p r in C T R L + clic k pe c el ule le d or it e. 8 . 9 .u n t a b el : 1 . s ele cta t i c olo a na du pa ca r e se fa c e s or t a rea . Copyright 2006 : Institutul Multimedia Romano Elvetian . 4 . 7 . P ent r u se lect ar ea un ei c oloa ne ut iliz a t i a ce ea si pr oc ed ur a da r d ea su pr a c o loa nei . Dat i cl ick pe a cest c ur s or s i s e va s ele ct a t a be lul s e lect ar ea t a be lul ui cu aj ut or ul s ele ct o ru lui d e t a g ur i din bar a d e st ar e D re am w ea v er. A pa re ca s et a S ort T a b le car e co nt in e m a i m ult e m e niu r i der u la nt e pe ntr u s or t a re a t a be lulu i. a pa sa t i O K . d at i c lic k s i s e v a s ele ct a t ot r a n dul . s e lect at i c om a nda Sor t Ta ble din m en iul C om m a nd s. K ee p TR W it h S or t e d r ow p ast r e az a a t r i but e le d e t a ble dup a s or t ar e . P ent r u s ele ct a r ea u nu i r a nd s e p oz it io nea za cur sor u l in st an ga r a n du lui p a na ce a c est a s e t r a ns f or m a i nt r -o sa ge at a nea g r a gr oa sa . i n m eni ul S or t B y. S o rta re a d at e l o r d i n t r. di n f er ea st r a Pr o per t ie s. 3 . a le get i s or t a r ea in or din e cr esc a t oar e sa u de scr es ca t oa r e din m en iul dr ept l a O r der . 6 . i n m eni ul O r der a le get i sor ta r ea co loa n ei in or d ine a lfa be t ica sa u n um er ica 5 . A pa sa t i t a gu l t a b le s i s e v a s ele ct a t ot t ab elu l. d ac a e x ist a u n ca p de t a ble la sa t i neb if at S or t I nc lude s F ir s t R ow.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei - - p oz it io nat i cur s or u l pe un a d int r e m ar g inil e ex t er ioar e ale t a b elu lui p a na ca nd a c est a s e t r a ns f or m a in cur s or cr uc e. In t ro du cer ea dat e lor in t a be l se fa c e pr in cl ick in c elu la d or it a s i int r o du cer ea d at e lor de la ta sta t ur a . s e p oa t e r ea liz a u n a lt s et de o pt iun i de s or t ar e p en t r u o a lt a c olo a na in or din ea se lect iei dor it e . C r ear ea un ui c a p d e t a b le s e fa ce pr in s ele ct a r ea pr im u lui r an d a t a bel ulu i s i b ifa r e a ca s et e i de v a l ida r e ( H ea der ) . s e lect at i t a bel ul 2 . t a gur il e pe nt r u c elu lu t a be l <t d> s e t r a nsf or m a in t a g ur i p ent r u ce lule ca p d e t a b el < t h> .

5 . p la sa t i c ur s or ul i m e dia t i na i nt e d e t a g u l de inc hid er e < ca p t ion > s i a pa sa t i b ar a d e sp at iu. C om a n da ut iliz a t a p entr u r ea liz ar ea a cest e i o per a t iun i e st e Im p or t T a bu lar D at a s i s e p oat e ut iliz a at un ci ca nd da t el e a u fost ex port a t e c a s i f is ier t e xt . s e v or a da ug a a ut om at t a gur ile <c a pt ion >. Importul datelor in tabel D re am w ea v er v a p er m it e s a im por t a t i da t e e x ist ent e int r . i nt r od uc et i t it lu l dor it i nt r e t a gur ile < ca pt io n> . t ipu l de car a ct er car e s epa r a ca m p ur ile d e d at e. s e lect at i C o de V ie w sa u v iz ua liz ar ea du b la a c od ulu i si a de si gnu lui . s pa t iul.o b az a d e da t e.o f oa ie de ca lcu l sa u d int r . P ent r u a s e put ea r ea liz a a c ea st a oper at iu ne tr e bui e c un os cut ce f el d e ca ra ct er est e ut iliz at ca s i de lim it at or . s e lect at i c om a nda T a ble C a pt io n. V a a pa r ea m e niu l d er u la nt c u at r ibu t e. 2 . D elim it at or ii ut iliz a t i d e ob ice i su nt : T a b. S ele ct a t i a lig n si a le get i l oc ul u nde dor it i sa f ie a f is at t it lul de ta be l. s e lect at i s ect iun ea Ta b le d in b ar a In ser t 4 . Copyright 2006 : Institutul Multimedia Romano Elvetian . 6 . A d au g a re a u n u i ti t l u d e t ab e l s e f a c e a st f el : 1 .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei Adaugarea unui titlu de tabel U n t it l u de t a b el nu po at e f i int r o dus d ec at da ca e st e a ct iv at a v iz ua li za r e a p a g inii in C o de V iew. p unc t ul s i v ir gu la s i dou a p un ct e . p la sa t i curs or u l im edi at du pa t a gu l de de sc hid er e a t a b elu lu i < t a ble > 3 .

Dr eam w ea v er va p er m it e s a t r a sat i elem e nt el e d e t a be l dir e ct in f er ea str a D oc um ent . 7 . s e lect at i d elim it a t or ul d e c am pur i. s e lect at i d elim it a t or ul d e da t e d in m en iul d er ul a nt D e lim it er 4 . p la sa t i curs or u l in l oc ul un de dor it i sa im p or t at i dat e le 2 . 5 . P RO IEC TA REA M A C H ET ELO R DE P A G IN A Prezentarea machetelor de pagina Ma ch et a d e pa gina s e r ef er a la m od ul in c ar e v a a rat a pa gin a a t u nc i ca nd v a f i v iz ua liz at a i n br o wser . s e lect at i O K p ent r u im por t a r ea d at el or . Imp o r tu l d at el o r i n Dre a m w e av e r s e fa c e i n m o d u l u rm at o r : 1 . 6 . s e lect at i F or m at To p R o w da ca f isi er ul d e d at e a r e u n ca p d e t a bel . s e lect at i s ub m e niu l Ex por t di n m eni ul F ile s i a po i co ma nd a Ex port T a b le 3 . Copyright 2006 : Institutul Multimedia Romano Elvetian . Exportul datelor din tabel D a ca dor it i sa ex p or t at i da t ele d in t r . 3 . d at i c lic k p e ex p or t si sa lva t i f isi er ul. In v iz ua liz a r ea L a y o ut . T a b ele le v a aj ut a sa int r od uc et i el em ent e le d in si t e int r . 5 .un t a be l va tr eb ui sa ef ec t uat i ur m a t oa r e le o per a t ii : 1 . i nt r . s e lect at i t a bel ul dor it sa u d at i c lic k int r .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei L a ex p or t ar ea f is ier ul ui de da te va tr e b ui sa a le get i u n de lim it at or c ar e sa v a a pa r a in dat e.un a num it lo c de p e e cra n. s e lect at i B r ow se si na v iga t i la f i sier ul d e dat e d or it . Da ca nu ex i st a in list a s el ect a t i O t her si i nt r od uc et i de lim it at or ul m a n ua l . s e lect at i F it t o Da t a pe nt r u ca nou l t a be l sa a ib a lat im ea co nf orm da t e lor d in f i sier ul d e da t e.un m od m u lt ma i us or . 4 . s e lect at i s t ilul d or it pe nt r u lin ie no ua – L in e B r ea k s in f un ct ie de s ist em ul d e o pera r e c e v a r ula ca nd se v or im p or t a d at e le. s e lect at i T a bular D at a d in se ct iu ne a C om m on a b ar ei I ns er t sa u c om a nd a T a b ula r Da t a d in s ub m e niu l Ta ble a l m en iulu i I ns er t.o ce lula din t a b el 2 .

s el ect at i bu t onu l Dr aw L ay out C ell d in b ar a In ser t 4. s el ect at i L ay out M od e din s ub m e niu l T a bl e Mo de a l m en iulu i V iew . m ut a r ea u ne i ce lulu se fa c e p r in s ele ct a r e s i t r a ger e in loc ul dor it .c ul oa r e de f und a l p ent r u o c elu la s a u un gr up d e c el ule . 2. ca r e fa ce ca o c oloa na sa se ex t ind a p entr u a um ple t ot s p at iul dis po nib i l d in f er ea st r a br ow s er ulu i.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei T r ec er e a la v iz ua li z a re a L a y out s e fa c e pr in s ele cta r e a b ut on ulu i La y out V iew d in s ub m e niu l Ta ble M od e a l m e niu lui V i ew. In v iz ua liz ar ea S t a nda r d pu t et i a lin ia c ont inut u l c elu lel or . 6. E d i t a re a u n u i t ab e l i n vi zu al i z a re a s t a n d a rd D upa pr o ie ct a r e a t a be lul ui in mo du l d e v iz ua liz ar e L a y o ut r ev e nit i la v iz ua liza r ea st a nda r d pe nt r u a da uga r ea co nt inut ulu i. t r as a t i ce lul e i n f e rea st r a D oc um ent . m a i p ut et i de a s em en ea ut iliz a b ut on ul L a y out d in bar a C om m o n. sa u a p a sat i C T RL +F 6. se cr eaz a a ut om a t un t a b el m a c het a car e v a c ont ine ce lule le ma ch et a. un ul pe nt r u t r as a r ea u nui t a be l ma ch et a si a lt ul pent r u t r a sar ea un ei c elu le m ac he t a ( o c e lula de t a be l) .c ul oa r e de f und a l p ent r u t ot t a b elu l Copyright 2006 : Institutul Multimedia Romano Elvetian . In m om ent ul i n c a r e v a af la t i in v iz ua li za r e L a y out de v in a ct iv e inc a dou a b ut o a ne pe nt r u m ac het a din ba r a I ns er t . P e nt r u s e lect ar e da t i c lic k p e ce lula . 5. sa u pr in a pa sa r ea t a st e lor C T RL +F 6. d ac a pu net i cur s or u l pe m ar g inile une i ce lul e c ont ur u l se sc him b a in li nie pl ina r os ie. In m odu l L a y out ex ist a o f un ct ie s upl im e nt a r a A u t ost r e c h ( a ut oe xt ind er e ). 3. a st f e l a pa r r e per e le d e m od if ica r e a dim en si unii ce l ule i. uni ce lule s a u d iv iz a ce lul ele in f un ct i e de m o du l de a f isar e in b ro w ser pe c a r e. Utilizarea vizualizarii Layout P ent r u cr ear ea un ei m a c het e d e pa gin a : 1.l dor it i . P ut et i de a s em en ea sa a da ug at i c ulor i la t a bel in fun ct i e de loc ul dor it : .

s e lect at i t a b el ul 2 . I n a c est ca z v a t r eb ui sa ga s it i a lt e solu t i i pe nt r u c onst r uir e a s it e. Copyright 2006 : Institutul Multimedia Romano Elvetian . D im e ns iun il e c e lule i de t a be l lim i t e az a la t im ea s i ina lt im ea t a be lul ui im br ica t . 3 . a c ce pt a t i v a lor ile i m p lic it e s i da t i O K . br ow s er ul va a f isa s it e. D a ca s unt pr ea m ul t e t a be le im br ic at e . Imb ri c a re a u n u i t ab e l In t ro du cer ea unu i t a bel int r . S e p ot a d a u ga i ma g in i de f unda l p en tr u o c elu la s a u pe nt r u t ot t a bel ul. s e lect at i c om a n da C onv ert T a b les t o L a y er s d in s ub me niu l C o nv er t a l m e niul ui M od if y .c ul oa r e pe nt r u c he nar u l une i c elu le sa u gr up de ce lule .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei . 0 sa u N et sca pe 4 . P la sa t i curs or u l in int er ior u l une i ce lul e s i ins er a t i u n t a b el n ou . a pa r e ca set a de d ia l og C o nv er t T a b les i n L a y er s. de la I E 4 .ul m a i le nt . P ent r u a t r a n sf or ma un t a be l in st r at ur i : 1 . T ra n s fo r m a re a t ab e l u l u i i n s t ra tu ri S t ra t ur ile per m it a m pla sa r ea a bs olut a a o bie ct e lor pe pa g i na .o ce lula de t a b el ins ea m n a un t a be l im br ica t ( n est ed) .ul ui.c ul oa r e de ch ena r pent r u t ot t a bel ul. 0. dar pe nt r u a f i a f isa t c or ect est e n ec esar a ut iliz ar ea br ows er e lor m od er ne .

u r ile nu su nt st a bil it e c u a t e nt ie . CONSTRUIREA CADRELOR SI A SETURILOR DE CADRE Prezentarea cadrelor (frames) C adr e le v a of er a po sib ilit a t ea in cl ude r ii ma i m u lt or pa gin i W e b int r . a st f e l ac e a pa gin a s e in ca r ca o s ing ur a dat a .ut iliz ar e a ca dr e lor p re de f init e din Dr ea m w ea v er Cadrul top.o f er ea st r a i ar af i sa r e a p a g inii sa s e fa ca in a lt ca d ru din f er ea st r a de br ows er ex is t ent a . A t unc i ca nd l ucra t i cu c a dr e Dr ea m w ea v er a ct iv eaz a c om enz ile Sav e F r am es et ( sa lv ar ea set ulu i de c a dr e) si F r am es et A s ( sa lv a r ea s et u lui d e ca dr e ca ).ul p ent r u a cr ea ca dr e n oi – Fr a m e B or der s d in s ubm e niul V is ua l A ids a l m e niu lui V iew .html Copyright 2006 : Institutul Multimedia Romano Elvetian .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei D upa t r a nsf or ma r ea t a bel ului in p a n oul L a y er s v a a pa r ea li st a s t r at ur ilor c e a u f ost cr ea t e d int r .u lui. c a t e u na pe nt r u fie ca re ca dr u. D a ca a v et i b if at a o pt iu nea Pr ev ent o v er la p s.un t a b el. U t iliz ar ea ca dr e lor poat e f i o s olu t i e ex c ele nt a d e a f isa r e a i nf or m at ii lor din t r u n sit e i n f er ea st r a br ow ser.o s ing ur a f er ea st r a d e br ow se r. I n f er ea str a P r o per t i es p ut et i da n um e dif er it e la f iecar e la y er p ent r u o m a n ipu la r e m a i us oa r a . i n m e niu l F ile . A ce st t ip d e r ea liz a r e a un ui s it e est e f oar t e ut il a t unc i ca nd d or it i ca int r .le c u m o us e. As t f el u n ut il iza t or poat e s ele cta o le gat ura din t r.u n ca d r u est e s ol ut ia i dea la . M et od e de cr ear e a ca dr e lor : . s e poa t e ut iliz a s i co ma nda S a v e A ll ca r e sa lv eaz a t ot co nt in ut ul ca dr ulu i si a l s et u lui d e c a dr e. D a ca o par t e d in pa g ina nu s e m od if ica n ici oda t a . Da ca d a t i c lick pe u n lay er d in list a se v a se lect a c e lula r es pe ct i va . s t ra t ur ile nu v or put ea f i s upr a p us e un ele p est e a lt ele.html Cadrul main.v iz ua liza t i c he na r ele d e ca dr e si t r a g et i.o p a g ina w eb s a av e t i in p er m a n ent a o t a bel a de cu pr in s ( m eni u) af is at a . at u nc i in t r o duc er ea a ce st e ia i nt r . C re ar e a u n u i se t d e ca d r e C adr e le s unt pa gin i w e b dif er i t e. da r po at e f i si un d ez a st r u da ca nu e st e cr eat c or ect s i da ca lin k. da ca d or it i c a un ele st r at ur i s a f i e su pr a p us e d es el ect a t i a c ea st a opt iun e. t oat e f ii nd p as t r at e d e o pa gina w eb se pa ra t a car e t ine a c est e ca dr e.ut iliz ar e a c om enz ilo r din su bm eni ul F r a m set a l m en iulu i Mod if y . A cea st a pa g ina s ep ar at a de f ine st e dim e ns iun ea si poz it i a fi ecar ui ca dr u in p a g ina .

A t unc i c a n d ex ist a c a dr e in pa gi na p ut et i a v ea a cc es la pa n ou l Fr am e s c ar e v a a j ut a s a gest io na t i m a i usor ca dr e le cr ea t e pr i n se lect ar e a ca dr el or i ndiv id ua le si st a b ilir ea a tr ib ut e lor f ie ca r u i ca dr u. a ce as t a de num ir e e st e n um ele ca dr ul ui r es pe ct iv si n u c el a l f is ier u lui c r ea t . A st f e l v a f i m ult m a i us or sa st a bilit i c oor dona t e le d e a f isa r e a pa gin ilo r int r u n a num it ca dr u . A t unc i ca nd d at i cl i ck p e un ca dr u d in pa no ul Fr a m e s. pr opr iet a t ile c a dr u lui r e sp ect iv v or f i d isp oni bile in fer ea st r a d e in sp ect ar e P r o pe r ti es . i ar ca dr e le e x ist ent e s unt im br ica t e in s et u l de ca dr e . Copyright 2006 : Institutul Multimedia Romano Elvetian . A f isar ea pa nou lui Fr am es s e fa ce di n m e niu l W ind ow – F r am es sa u pr in t a st a r ea SH I FT +F 2. P r in im pa r t ir e a u nui c a dr u Dr ea m w ea v er cr eaz a u n no u ca dr u s et .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei P ent r u a da un t it lu de p a gi na v a t r eb ui s a s ele ct a t i p a g ina W e b ca r e c ont in e s et u l d e ca dr e. nu me le c a dr e lor co nt in ut e de a ce st a nu v or f i a f isa t e in br ow s er n ic iod at a . Est e f oa r t e bin e s a d at i o d en um ir e f ieca r u i ca dr u.

P ent r u ut iliz a r ea a ce st e i f un ct ii se ef e ct u eaz a ur ma t or ii pa s i : 1 . car e cr e ea za o le ga t ur a goa la 3 .Y es – a ct iv ea za a f is ar e a b ar elor de der u lar e . v et i av ea in m en iul d er u la nt s i n um ele ac est or c a dr e.ul.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei S ta b i l i re a a t ri b u t e l o r p en t ru c a d r e F ie ca re ca dr u car e l.o f er ea st r a nou a d e br o w ser.N o – d ez act iv e az a b ar ele de der u lar e .u n a num it ca dr u._ bla nk – de sc hi de p a g ina W e b int r. D a ca at i i nt r od us un n um e p en t r u f ie ca r e ca dr u cr eat . D a c a nu d or it i sa f ie a f is at e s ele cta t i N o di n m e niu l der u la nt B or de r s s i nu v a f i a f isa t d oar d ac a c a dr ele a d ia cent e a u set at e la r a n du l lor N o la b or der s. pe nt r u m en iul S cr o ll a v et i p at r u v ar ia nt e : . I n m om ent ul i n car e se lect at i un ca dr u d in p a n oul Fr am es ._ se lf – d es ch ide p a g ina W e b in a ce ea si f er ea st r a c u ca dr u l ca r e c ont in e l ink ul . d es c hidet i pa no ul B e ha v ior s d in m en iul W ind ow. i n ca s et a L in k in tr o duc et i j a v as cr ip t :v oid ( 0) . sa u SH IFT +F 3 4 ._ pa r e nt – desc hid e pa gin a W eb in c a dr ul s et . d at i c lic k p e “ +” si s e lect at i G o T o U RL 5 . gr o sim ea a ces t or c he nar e s i cu loa re a dor it a ._t op – de sc hi de p a g ina W e b in t oat a f er ea st r a br ow s er ul ui .D ef a u lt – p ent r u ce l e m a i m ult e br ow se re est e e ch iva len t ul la A ut o . i ar da ca co nt in ut ul e st e ma i m ar e d eca t p a g ina a f is at a . v iz it at or i i nu v or p ut ea v e de a ac est cont in ut . a po i a p a sat i O K . s e lect at i o bie ct u l di n ca dr u c ar e va dev en i hip er le ga t ur a 2 . In m om ent u l in c a r e at i i nt r odu s un lin k int r . In f er ea st r a d e i ns pect ar e Pr o pr ier t ie s pu t et i st a b ila da c a dor it i ca s a f ie v iz ibil e ch ena r ele c a dr elor.A ut o – s e a ct iv eaz a ba r ele d e der ula r e at un ci ca n d co nt in ut ul c a dr u lui e st e m a i m ar e d ec at s up ra fat a v iz ib ila in br ow s er . Copyright 2006 : Institutul Multimedia Romano Elvetian .a t i cr ea t a r e a t r ib ut e le pr opri i de d er ula r e a f is at e in f er ea st r a de ins pe ct a r e P r o per t i es. C u a j ut or u l f u nct iei G o T o U RL put et i sa incar cat i do ua ca dr e de oda t a la a ct i ona r ea unu i lin k . s e lect at i ca d r u l do r it si int r od uc et i UR L. i n m en iul d er u la nt T ar get a v et i la dis po z it ie p at r u de num ir i r ez er va t e pe nt r u le ga t ur i : .

modificarea straturilor FORMATAREA PAGINILOR WEB Stilurile HTML si Cascading Style Sheets Crearea si aplicarea unui stil personal Optiunile stilurilor Pozitionarea unui strat cu stil Crearea unei foi de stil externe FOLOSIREA FUNCTIILOR BEHAVIOR Prezentarea functiei Behavior Afisarea si ascunderea straturilor Deschiderea unei ferestre noi Afisarea unui mesaj Adaugarea unui mesaj in bara de stare Copyright 2006 : Institutul Multimedia Romano Elvetian . STRATURI Ce este Dynamic HTML? Adaugarea unui strat Imbricarea straturilor Taguri pentru straturi Alinierea.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei CURS V LIMBAJUL DINAMIC HTML.

Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei LIMBAJUL DINAMIC HTML. STRATURI DHTML este o extensie a lui HTML care ofera posibilitatea dezvoltatorilor de pagini Web sa aiba un control mai mare asupra machetarii si pozitionarii in pagina. care vor aparea cand utilizatorul apasa un buton sau da click pe o zona fierbinte . puteti face ca textul sau imaginile sa se miste pe ecran . puteti permite vizitatorilor sa faca operatiuni de drag-and-drop asupra obiectelor. puteti crea meniuri pop-up . Adaugarea unui strat Straturile sunt zone pe care le veti folosi pentru pozitionarea unui continut pe o pagina Web. Ce puteti realiza cu ajutorul DHTML : adaugarea de imagini ascunse. schimbarea culorii sau dimensiunii textului in momentul in care un vizitator trece cu mouseul peste el. apoi butonul Draw Layer selectati Layer din submeniul Layout Objects al meniului Insert Strat Copyright 2006 : Institutul Multimedia Romano Elvetian . Crearea unui strat in Dreamweaver se poate face astfel: • • din bara Common selectati Layout. Atributele straturilor : Visibility – vizibilitate – va permite sa ascundeti continutul unui strat si acesta sa fie afisat in momentul in care se realizeaza o anumita operatiune Z-index – prin acest atribut se controleaza ordinea de asezare a straturilor pe pagina. ca raspuns la operatiunile effectuate de catre vizitator. incarcarea unui text intr-o anumita zona a ecranului.

apar reperele de manevrare care va permit sa mariti sau micsorati dimensiunea sau sa mutati layerul. atunci cand este bifata straturile create pot fi suprapuse. Imaginea se va repeta ca un mozaic in cadrul stratului in cazul in care imaginea este mai mica decat stratul si el va fi afisat peste imaginea din fundal. Cu ajutorul panoului Layers (F2 sau Window – Layers) puteti selecta layerele dorite si puteti stabili caracteristicile visibility si z-index. Copyright 2006 : Institutul Multimedia Romano Elvetian . atunci puteti selecta layerele dorite cu ajutorul tastei SHIFT + click. Aceasta caracteristica se utilizeaza in special la crearea tabelelor. Acest lucru poate fi realizat si din fereastra de inspectare Properties. T – top (sus). iar unitatea de masura implicita este pixelul. atunci cand vor fi multe layere in pagina va fi foarte dificil sa le gestionati . Mai exista o caseta de validare Prevent overlaps. Este recomandabil sa dati un nume distinct pentru fiecare layer creat. Din fereastra de inspectare Properties puteti seta pozitia stratului relativ la toata fereastra browserului. un tabel nu poate avea elemente suprapuse. De asemenea puteti stabili o culoare de fundal pentru strat.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei In momentul in care selectati un layer. Daca doriti sa modificati pozitia mai multor layere. Stabilirea pozitiei unui strat Fiecare layer are un reper de manevrare cu ajutorul caruia puteti sa-l trageti in pozitia dorita. sau utilizarea unei imagini de fundal pentru stratul respectiv. L – left. numele se recomanda sa nu contina spatii sau semne de punctuatie.

Pentru ca un strat sa fie imbricat. layerul are caracteristica de vizibilitate activa. Daca stratul parinte este vizibil. Imbricarea straturilor Puteti crea straturi imbricate. Stratul imbricat va aparea in panoul Layers indentat la stratul parinte. Vizibilitatea unui strat poate fi setata din fereastra de inspectare Properties sau din panoul Layers. care atunci cand este deschis. In momentul in care deplasati stratul parinte. tineti apasata tasta CTRL si trageti stratul peste stratul in care doriti sa fie imbricat.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei In cazul in care doriti ca straturile sa se suprapuna in pagina. Copyright 2006 : Institutul Multimedia Romano Elvetian . caz in care exista o reprezentare grafica – un ochi. astfel stratul care are valoarea cea mai amre va fi intotdeauna deasupra. stratul copil se va deplasa odata cu el. atunci si stratul copil este vizibil. caz in care stratul imbricat este considerat copil si mosteneste caracteristicile stratului parinte. va trebui sa setati valoarea zindex pentru fiecare strat. selectati stratul in panoul Layers.

Tagurile straturilor In preferintele pentru straturi puteti stabili tagul implicit pentru straturi. va permit sa aplicati o proprietate sau un grup de proprietati unui obiect prin aplicarea unui stil acelui obiect. Copyright 2006 : Institutul Multimedia Romano Elvetian . Ambele variante vor functiona fara probleme. acesta poate fi <div> sau <span>.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei Operatiunea de scoatere din imbricare se face invers celei de introducere a stratului in imbricare. FORMATAREA PAGINILOR WEB Stilurile HTML si Cascading Style Sheets Css (Cascading Style Sheets) – foi de stil in cascada. Tagul <span> este mai mult utilizat pentru a stabili caracteristicile unui fragment de text. tagul <div> este solutia logica de utilizare. dar conform standardului W3C.

va aparea caseta de dialog Style Definition avand selectata categoria Type. 7. stilurile personale incep cu un punct 4. apare o caseta de dialog New Style. 6. introduceti un nume in caseta de nume. Crearea si aplicarea unui stil personal Panoul CSS Styles contine lista stilurilor personale care au fost create si definite si sunt gata de a fi utilizate in pagina Web. 8. 5. Type – defineste atribute de scriere si poate fi aplicat unui text sau asupra unui obiect care contine text Background – defineste atribute de fundal – culoarea sau imaginea si poate fi aplicat obiectelor in care puteti stabili fundal sau culoare Block – defineste atributele de scriere pentru paragrafe Box – defineste atributele aplicate unui obiect. 3. astfel stilul va fi plasat in partea de sus a paginii Web curente 5. dimensiunea si culoarea dorita. cum ar fi dimensiunea marginii Border – attribute aplicabile obiectelor cu chenare – tabele si straturi List – attribute pentru liste – tipul de marcare Positioning – defineste atributele unui strat – vizibilitatea si z-index Extension – attribute pentru dezvoltari ulterioare valabile doar pentru IE. 4. selectati butonul radio Class. Copyright 2006 : Institutul Multimedia Romano Elvetian . selectati butonul New CSS Style din panoul CSS Styles 2. selectati optiunea This Document Only – se aplica doar acestui document. Pentru a crea un stil personal: 1. selectati tipul fontului dorit. 2. Optiunile stilurilor : 1. se aplica oricarui tag si creeaza un stil personal 3.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei Stilurile se definesc si se aplica in Dreamweaver in panoul CSS Styles si pot fi folosite si la pozitionarea obiectelor si atributele chenarelor. 6.

creati si denumiti un stil personal 2. Pentru a crea un stil pentru straturi : 1. selectati categoria Positioning din caseta de dialog Style Definition 3.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei .caseta de dialog Styles definition Pozitionarea unui strat cu stil Atunci cand se lucreaza cu straturi este util sa le pozitionati pe ecran cu ajutorul stilurilor. Width si Height Copyright 2006 : Institutul Multimedia Romano Elvetian . stability proprietatile Left. selectati Absolute din categoria Type 4. Top.

apasati OK. Crearea unei foi de stil externe Stilurile create pot fi realizate si extern. creati un stil nou si selectati New Style Sheet File 2. Dupa ce ati creat stilul il puteti edita de cate ori doriti si sa salvati stilurile noi in acelasi fisier. apasati butonul Attach Style Sheet – din panoul CSS Styles si selectati foaia de stil externa.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei 5. selectati butonul OK 3. Atunci cand actualizati o foaie de stil externa. se actualizeaza automat toate setarile din paginile care depind de acel stil. apasati ok. selectati Link si apasati ok. FOLOSIREA FUNCTIILOR BEHAVIOR Copyright 2006 : Institutul Multimedia Romano Elvetian . 3. Apasati OK. introduceti un nume pentru foaia de stil. Pentru a crea o foaie de stil externa : 1. se deschide caseta de dialog Save Style Sheet File As. intr-un fisier care sa fie aplicat la toate paginile Web existente intr-un site. Daca doriti sa creati o hiperlegatura cu effect de rollover: 1. navigati pana la directorul unde doriti sa salvati foaia de stil 4. Pentru a aplica o foaie de stil la o pagina noua. 4. Foile de stil externe se termina in extensia .css. 5. la selector type selectati Advanced din meniul derulant Selector alegeti a:hover bifati butonul radio This document only apasati ok. 2. iar din CSS style definition selectati o culoare pentru text.

Puteti sa atasati mai multe functii behavior diferite pentru un obiect. La tagul obiectului va fi adaugat codul care intercepteaza evenimentul si care va apela codul JavaScript. vizitatorii nu vor putea vedea actiunea inclusa in pagina sau vor primi un mesaj de eroare din JavaScript. Ordinea poate fi modificata prin actionarea sagetilor in sus sau in jos din panoul Behaviors. Dreamweaver va include automat codul JavaScript necesar in sectiunea head a paginii Web. aceste functii nu sunt selectabile din lista.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei Prezentarea functiei behavior Functiile behavior (comportamente) din Dreamweaver va ajuta sa adaugati dinamica si interactivitate in site. Daca ati selectat un eveniment care nu functioneaza intr-un anumit browser. O functie behavior este o actiune declansata de un eveniment: Eveniment + Actiune = Functie Behavior Evenimente: onMouseOver = se declanseaza la plasarea cursorului deasupra unui obiect onMouseDown = se declanseaza la apasarea butonului mouse-ului onMouseUp = se declanseaza la eliberarea butonului mouse-ului onClick = se declanseaza la apasarea si eliberarea butonului mouse-ului onLoad = se declanseaza cand obiectul sau pagina a incheiat incarcarea onBlur = se declanseaza cand obiectul pierde focusul onFocus = se declanseaza cand obiectul primeste focusul Atunci cand atasati o functie behavior unor obiecte din pagina. Aceste functii va permit sa lansati diferite actiuni atunci cand vizitatorul muta cursorul in site. Dreamweaver deschide casete de dialog de functii behavior. evenimentele vor avea loc in ordinea in care au fost listate. La crearea unui eveniment va trebui sa selectati browserul pentru care doriti sa ruleze evenimentul. Copyright 2006 : Institutul Multimedia Romano Elvetian . unde veti selecta evenimentul care sa declanseze functia behavior (comportamentul). da click cu mouse-ul sau incarca o pagina Web. Dreamweaver nu va permite atasarea unor functii behavior unor obiecte care nu sunt adecvate functiei apelate.

next si altele Location toolbar – afiseaza URL-ul curent Status bar – bara de stare este in partea de jos a browserului Menu bar – contine meniurile standard ale browserului Scrollbars – permite vizitatorului sa deruleze fereastra browserului Resize handles – vizitatorul poate sa redimensioneze fereastra Window Name – nume optional Pentru a deschide o fereastra noua : 1. deschideti panoul Behaviors si dati click in interiorul hiperlegaturii create. Deschiderea unei ferestre noi Pentru a afisa un URL intr-o fereastra noua Dreamweaver pune la dispozitie functia Open Browser Window. stabiliti latimea si inaltimea ferestrei si marcati atributele dorite Copyright 2006 : Institutul Multimedia Romano Elvetian . inserati o imagine intr-o pagina Web si selectati imaginea 2. apasati butonul + din panoul Behaviors si selectati functia behavior Show-Hide Layers 6. click pe OK pentru salvarea setarilor efectuate. creati un strat nou in pagina ascundeti stratul creat prin schimbarea atributului de vizibilitate adaugati o legatura goala la textul sau imaginea inserata – javascript :void(0). in caseta de dialog Open Browser Window completati URL-ul care va fi incarcat in noua feresatra 4. Functia Show-Hide Layers va fi umbrita daca in pagina nu exista un Layer. in panoul Behaviors dati click pe + si selectati functia Open Browser Window 3. 3. 4. 2. Atribute : Navigation toolbar – contine butoanele de navigare back. in caseta de dialog Show-Hide Layers selectati stratul si dati click pe butonul Show 7.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei Afisarea si ascunderea straturilor Pentru a afisa sau a ascunde un strat al paginii Web exista functia Show-Hide Layers si trebuie creat un eveniment care sa declanseze actiunea. In bara de de titlu a panoului Behaviors trebuie sa apara <a> Actions 5. Adaugarea functiei Show-Hide Layers unei hiperlegaturi se face astfel : 1. Puteti deschide o fereastra de browser cu o anumita domensiune si anumite atribute ale browserului.

dati click pe OK. Afisarea unui mesaj Puteti adauga o functie noua care sa deschida o caseta de avertizare JavaScript – Popup Message. in caseta de dialog Popup Message introduceti mesajul care doriti sa apara in caseta de avertizare 4. Copyright 2006 : Institutul Multimedia Romano Elvetian . selectati imaginea inclusa in site 2.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei 5. astfel : 1. dati click pe OK. apasati + si selectati functia Behavior Popup Message 3.

Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei Adaugarea unui mesaj in bara de stare 1. introduceti textul care doriti sa apara in bara de stare si dati click pe OK. selectati un obiect de pe pagina pentru a declansa functia behavior Set Text of Status Bar 2. selectati butonul + din panoul Behaviors si alegeti functia behavior Set Text of Status Bar 3. Copyright 2006 : Institutul Multimedia Romano Elvetian .

Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei CURS V FUNCTII BEHAVIOR AVANSATE Utilizarea selectorului de taguri Restrangerea miscarii stratului Captarea pozitiei destinatiei stratului Drag Layer Eveniment atasat tagului ANIMATII FOLOSIND CONTROALELE DE TIMP Crearea unei animatii Utilizarea panoului Timelines Inregistrarea unei animatii.Autoredare.Ciclare Utilizarea mai multor controale de timp intr-o pagina Web CREAREA UNUI FORMULAR SI PRELUAREA DATELOR Crearea unui formular Butoane radio. Casete de validare Adaugarea unei liste sau a unui meniu Butoane si butoane cu imagini Crearea unui meniu de salt Copyright 2006 : Institutul Multimedia Romano Elvetian .

Deschideti o pagina web noua in care veti crea patru straturi care vor fi trase cu mouse-ul. Aceasta functie este utila pentru crearea suprafetelor mobile. Straturile pot contine orice : text. Apoi veti crea un strat destinatie. casete de dialog si alte tipuri de interactiuni. Copyright 2006 : Institutul Multimedia Romano Elvetian .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei FUNCTII BEHAVIOR AVANSATE Drag Layer – este o functie behavior avansata care va permite sa creati straturi pe care vizitatorul le poate deplasa cu mouse-ul in fereastra browserului. a jocurilor puzzle. imagini sau chiar si alte straturi.

Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei Functia Drag Layer va permite vizitatorului sa traga stratul cu mouse-ul. selectati tagul <body> din selectorul de etichete din Bara de stare a Dreamweaver dati click pe butonul + al panoului Behaviors si selectati Drag Layer apare caseta de dialog Drag Layer 4. 2. care poate fi activata la incarcarea paginii prin interceptarea evenimentului onLoad al tagului <body>. Pentru a folosi functia Drag Layer si a crea straturile de tragere si de destinatie trebuie efectuati urmatorii pasi : 1. Copyright 2006 : Institutul Multimedia Romano Elvetian . 5. trebuie sa activam aceasta functie. selectati numele stratului care va fi tras cu mouse-ul selectati Constrained (restrans) din meniul derulant Movement. 3. Inainte de a putea fi tras stratul.

de unde puteti defini suprafata de tragere. care capteaza pozitia stratului si completeaza automat coordonatele : 1. 4.manerul usii. apar casetele in care trebuie sa introduceti valorile in pixeli ale coordonatei suprafetei de restrangere apasati ok. daca aveti o usa care trebuie deschisa. pentru o fixare cat mai exacta puteti utiliza tastele sageti care deplaseaza stratul cate un pixel selectati tagul <body> di selectorul de taguri dat dublu click pe functia Drag Layer in panoul Behaviors pentru a o edita dati click pe Get Current Position. puteti stabili ca si zona de tragere . Copyright 2006 : Institutul Multimedia Romano Elvetian . 2. verificati ca in panoul Behaviors sa nu fie bifata caseta de validare Prevent Layer Overlaps pozitionati stratul configurat cu functia Drag Layer. in pozitia finala de destinatie. 6. In caseta de dialog Drag Layer aveti o sectiune Advanced. valorile pentru Left si Top se vor completa automat setati distanta pentru alipirea la grila Snap if Within dati click pe ok puneti stratul in pozitia sa initiala.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei 6. Puteti sa definiti o anumita suprafata din layer-ul selectat sa fie activ la tragere. 5. 7. Acest lucru poate fi utilizat pentru a crea un control mai strict a zonei active le tragere. O solutie mai simpla de introducere a datelor de restrangere a stratului. coordonatele zonei de tragere fiind relative la coltul din stanga sus al stratului care va fi deplasat. astfel. este utilizarea butonului Get Current Position. 3. 8. 7.

ANIMATII FOLOSIND CONTROALELE DE TIMP Crearea unei animatii Cu ajutorul Dreamweaver puteti realiza animatii care sa ruleze in browser. Copyright 2006 : Institutul Multimedia Romano Elvetian . iar avloarea initiara z-index sa fie refacuta automat dupa ce stratul a fost plasat in pozidia dorita. utilizand panoul Timelines care va ajuta sa modificati proprietatile in functie de timp.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei De asemenea exista posibilitatea sa stabiliti ca stratul tras sa fie deasupra celorlalte straturi indiferent de valoarea atributului z-index.

indiferent daca utilizati modul design sau in cod. Afisarea blocurilor de Exista posibilitatea afisarii codului dorit prin extinderea sau ascunderea cod blocului de cod. Dreamweaver 8 livreaza configuratii diferite necesare lucrului in cod sau design. o serie de butoane menite sa usureze inserarea unor elemente comune de comanda. Noutati in DREAMWEAVER 8 Transferul fisierelor Transferul fisierelor in server se face in background. Copyright 2006 : Institutul Multimedia Romano Elvetian . Spatiu de lucru Configurarea si personalizarea spatiului de lucru. la afisarea in mod cod. Exista de asemenea posibilitatea crearii unei configuratii personalizate. Zoom Este o functie care permite inspectarea imaginilor sau lucrul cu tabele imbricate mai complexe.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei DREAMWEAVER 8 Dreamweaver 8 include o serie de noutati menite sa imbunatateasca utilizarea aplicatiei si sa ajute la crearea paginilor mult mai facil. incluzand suport pentru utilizarea avansata a CSS. in timp ce se lucreaza la paginile web. Linii de ghidaj Afisarea unor linii de ghidaj pentru a avea o imagine precisa a dimensiunii paginii si vizualizarea ei in browsere. De asemenea permite previzualizarea unei pagini. care poate fi salvata sub numele dorit si utilizata atunci cand doriti. Bara de unelte in cod Dreamweaver 8 afiseaza de-a lungul paginii. fara a mai fi nevoiti sa le scriem direct in pagina. Dreamweaver 8 ofera suport pentru cele mai noi standarde. astfel incat sa poata fi vazuta afisarea reala a paginii. XML si RSS feeds.

sau doar lipirea textului. Editarea in cod A fost imbunatatit controlul la lucrul in cod prin inchiderea automata a tagurilor deschise. De asemenea Dreamweaver 8 ofera suport pentru noile tehnologii inclusiv PHP 5. ColdFusion MX 7 si Macromedia Web Publishing System. Lipire speciala Cu noua optiune din Dreamweaver. poate fi retinuta sursa completa creata in Microsoft Word. exclus de la transfer sau transfer esuat. Copyright 2006 : Institutul Multimedia Romano Elvetian . Acestea pot fi si setate personalizat. Sincronizarea site- A fost imbunatatit managementul site-urilor prin functii de sincronizare ului. Check-in/check. Fisiere comparate Exista posibilitatea compararii a doua fisiere locale. De asemenea poate fi salvata activitatea intr-un fisier log cu evenimente. astfel incat sa se depisteze rapid diferentele dintre ele. De asemenea out a fost imbunatatit modulul de verificare prin functia check-in/check-out astfel incat sa se evite scrierile accidentale peste fisiere scrise de altcineva. din cateva click-uri de mouse. sau a unuia local si a altuia din server.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei Layout Au fost incluse layout-uri noi de desing. Transferul fisierelor In Dreamweaver 8 poate fi vizualizata starea fisierelor care se transfera: transferat cu succes.avansate care verifica daca fisierul in uz este in varianta finala. CSS Toate functionalitatile CSS au fost incluse intr-un singur panou. care permit crearea usoara a paginilor web. astfel incat lucrul cu stiluri sa fie mult mai usor si mai productiv. Flash Video Dreamweaver 8 permite introducerea filmelor Flash in pagina web intr-un mod foarte simplu.

15. Previzualizarea in browser a unui server de test. Stergerea unor fisiere sau directoare din server. 16. 9. 14. 8. Inserarea unui serviciu web.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei In timpul transferului Dreamweaver nu permite realizarea anumitor activitati Server-related. Put/Get/Check in/Check out. Copyright 2006 : Institutul Multimedia Romano Elvetian . 12. Inserarea unei imagini din server. 13. Deschiderea unui fisier din server. 18. Tragerea fisierelor in server. 10. cum ar fi: 6. Salvarea unui fisier in server. Salvarea automata a fisierelor in server dupa modificare. 17. Crearea unei conexiuni cu baza de date. Undo check-out. Previzualizarea datelor live. 7. 11. Bind dynamic data.

paginile cu imagini sau text de dimensiuni reduse putand fi editate mult mai facil. Zoom Functia Zoom va permite sa mariti sau sa micsorati pagina web. astfel incat sa puteti verifica acuratetea paginii la nivel de pixel. Decupare. sau se selecteaza cu mouseul zona care se doreste a fi marita. copiere sau lipire a fisierelor in server. Copyright 2006 : Institutul Multimedia Romano Elvetian .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei 19. Aceasta functie este disponibila doar in modul Design. Exista mai multe moduri de utilizare a acestei functii: 13. se selecteaza lupa din partea dreapta jos a ferestrei document si se da click in pagina in zona in care se doreste afisarea detaliata.

la masurarea elementelor din pagina sau simularea vizualizarii in browser. incadrare in pagina a zonei selectate – este activa doar daca a fost selectata o zona initial 17. Aceste linii de ghidaj sunt utile pentru alinierea obiectelor din pagina mult mai precis. Crearea unei linii de ghidaj orizontala sau verticala: 5. trageti cu mouse-ul de rulerul corespunzator 6. incadrare in pagina completa. Pentru a seta liniile de ghidaj in pixeli. 15.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei 14. Pentru a va ajuta la alinierea elementelor din pagina. din lista de marire se poate seta ca pagina sa fie incadrata automat in functie de necesitati: 16. De asemenea exista posibilitatea ca liniile de ghidaj sa fie blocate pentru a se preveni mutarea accidentala de catre un alt utilizator. se poate selecta lista de marire a paginii (Set magnification) si se selecteaza procentul dorit. Linii de ghidaj Liniile de ghidaj se obtin prin tragerea cu mouse-ul a marginilor de la ruler. pentru ca alipirea sa functioneze). astfel incat sa fie vizualizata toata pagina in fereastra document. liniile de ghidaj. sau de alipire a liniei de ghidaj la elemente (elementele trebuie sa fie in pozitie absoluta. trebuie apasata tasta SHIFT in momentul crearii liniilor. sunt setate in pixeli de la marginea de sus sau din stanga ferestrei document. incadrare pe latimea paginii 18. Copyright 2006 : Institutul Multimedia Romano Elvetian . In starea initiala. pozitionati linia de ghidaj in fereastra document si eliberati butonul de la mouse Liniile de ghidaj pot fi repozitionate prin tragerea din nou cu mouse-ul. Dreamweaver va pune la dispozitie o functie de alipire a elementelor la linia de ghidaj.

pozitionati mouse-ul deasupra liniei si apasati tasta CTRL Pentru a schimba culoarea liniilor de ghidaj: • Select View > Guides > Edit Guides Copyright 2006 : Institutul Multimedia Romano Elvetian .Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei Pentru a afisa sau ascunde liniile de ghidaj: • Select View > Guides > Show Guides Pentru alipirea elementelor la liniile de ghidaj: Select View > Guides > Snap to Guides Pentru alipirea liniilor de ghidaj la elemente: Select View > Guides > Guides Snap to Elements Pentru a bloca sau deblca liniile de ghidaj: • Select View > Guides > Lock Guides Pentru a muta linia de ghidaj intr-o anumita pozitie: • • • • dublu click pe linia de ghidaj introduceti noua pozitie in fereastra de dialog si apasati OK pentru a vizualiza pozitia liniei de ghidaj tineti mouse-ul deasupra liniei pentru a vizualiza distanta dintre liniile de ghidaj.

sublinierea codului invalid. Bara de unelte in cod in cod nu poate fi mutata sau andocata la grupul de panouri.. Daca se da click in continuare. () sau []. trageti linia cu mouse-ul pana in ruler si astfel va disparea linia selectata.: <table>. Apply Comment / Remove Comment • inserare sau stergere comentarii in pagina. Recent Snippets • permite inserarea ultimelor coduri snippets utilizate. Expand All • reafiseaza codul restrans prin comanda Collapse.</table>. Collapse Selection • ascunde doar tagul selectat. cum ar fi restrangerea sau expandarea selectiei de cod. adaugarea sau stergerea comentariilor.Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei • selectati culoarea dorita din meniul pop-up si apasati OK Pentru a schimba culoarea care indica distanta dintre liniile de ghidaj: • • Select View > Guides > Edit Guides selectati culoarea dorita de la setarea de distanta a liniilor de ghidaj Pentru a sterge o linie de ghidaj. Show Line Numbers • afiseaza sau ascunde numarul liniilor de cod. sau prin click pe butonul drept al mouse-ului si deselectare Coding. Wrap Tag • incadreaza codul in fereastra document astfel incat sa nu mai efectuati scroll pentru afisarea liniilor de cod. Highlight Invalid Code • afiseaza codul invalid. se restrange continutul tagului selectat (de exp. dar poate fi ascunsa daca doriti acest lucru.. Pentru a sterge toate liniile de ghidaj: • Select View > Guides > Clear Guides Bara de unelte in cod Cu ajutorul barei de unelte in cod puteti adauga cateva operatiuni standard de codare. din meniul View – Toolbars – Coding. Aceasta functie este activa doar la vizualizarea paginii in cod. Prin selectare. bara de unelte aparand pe verticala in stanga ferestrei document. Collapse Full Tag • prin plasarea cursorului inaintea unui tag si apasarea butonului. Copyright 2006 : Institutul Multimedia Romano Elvetian . se afiseaza tagurile parinte pana la tagul <html>. Select Parent Tag • selecteaza continutul tagului selectat. • • • • • • • • • • • Open Documents • afiseaza documentele deschise. se deschide documentul in fereastra document. Balance Braces • afiseaza codul continut intre {}.

Macromedia Dreamweaver MX Realizator curs: Sebastian Mezei Spatiu de lucru Dreamweaver 8 ofera posibilitatea salvarii suprafetei de lucru in mod personalizat. Aceste configuratii pot fi accesate din meniul Window – submeniul Workspace Layout. Pentru a sterge sau redenumi un spatiu de lucru personalizat. Pentru a crea un spatiu de lucru personalizat: • • • aranjati grupul de panouri sau panourile in modul dorit selectati Window > Workspace Layout > Save Current introduceti un nume si apasati OK. Designer. Dual Screen. In mod implicit exista 3 variante de setari a suprafetei de lucru: Coder. in functie de preferintele fiecarui utilizator. accesati Window > Workspace Layout > Manage. Copyright 2006 : Institutul Multimedia Romano Elvetian .

Sign up to vote on this title
UsefulNot useful