Sunteți pe pagina 1din 30

MINISTERUL EDUCAIEI, CERCETRII I INOVRII GRUPUL COLAR DIMITRIE FILIANU FILIAI

LUCRARE PENTRU OBINEREA CERTIFICATULUI DE COMPETEN PROFESIONAL

NDRUMTOR, Prof. RDULESCU RODICA

ABSOLVENT, ION ADELA IONELIA

2012

MINISTERUL EDUCAIEI, CERCETRII I INOVRII GRUPUL COLAR DIMITRIE FILIANU FILIAI

RASE DE CAINI

NDRUMTOR, Prof. RDULESCU RODICA

ABSOLVENT, ION ADELA IONELIA

2012

Cuprins:

Motivatie Introducere html Structura html Atribute html Text html Grafica html Elemente video html Miniaplicatii Java in html Link-uri html Tabel html Liste html Cadre html Formulare html Codul sursa Bibliografie

MOTIVATIE
Fiecare rasa este descrisa din cele mai importante puncte de vedere: dimensiuni, greutate, culoare, temperament si calitati. De asemenea, un scurt istoric al fiecarei rase si cateva poze sugestive completeaza imaginea de ansamblu.

Din pacate, numarul mare de rase canine existente face imposibila acoperirea in totalitate a subiectului. De aceea va recomandam sa reveniti in aceasta sectiune, atat timp cat in fiecare saptamana vom adauga aproximativ cate doua noi rase de caini si catei.

Itroducere n HTML
Ce este WWW? WWW= World Wide Web , adesea numit Web. Web-ul este o retea de computere din toata lumea. Toate computerele folosesc un standard de comunicare numit HTTP. Cum functioneaza WWW-ul? Informatia Web este stocata in documente numite pagini html. Paginile html sunt fisiere stocate in computere numite servere web. Computerele care citesc paginile html sunt numite clienti web. Clientii web vad paginile cu un program numit browser web. Cele mai populare browsere sunt Internet Explorer si Mozilla Firefox (il recomand pe cel din urma). Cum afiseaza browser-ul paginile html? Toate paginile html contin instructiuni despre cum sa fie afisate. Browser-ul afiseaza pagina citind aceste instructiuni. Cele mai obisnuite instructiuni de afisare sunt numite taguri HTML. Tagurile HTML arata astfel: . Prima pagina html Pentru inceput trebuie sa ne asiguram ca avem extensiile fisierelor afisate. Apoi pe desktop se creaza un fisier text "new text document" si i se schimba numele in index.html . Prima pagina a unui site se numeste index.html (Nu este obligatoriu ca extensia sa fie .html . De exemplu daca folositi PHP in pagina de index pagina se va numi index.php ) . Pagina se deschide cu Notepad unde se scrie codul html (poti copia exemplul cu structura de mai jos), salveaza fisierul, inchide-l, apoi deschide-l cu internet explorer. Internet Explorer = IE (prescurtat).

Structura unei pagini


Orice pagina incepe si se sfarseste cu tagurile: O pagina trebuie sa aiba tagurile: -contine informatii despre pagina respectiva; -contine corpul paginii; O structura a unei pagini HTML : <html> <head> <title> </title> </head> <body> </body> </html>

Atribute
Atributele sunt ca o descriere pentru taguri, ele mereu au nume si o valoare. Un atribut se scrie sub forma: si se introduce in tag sub forma: Ex: La tagul body putem sa adaugam atributul bgcolor cu valoarea yellow sub form <body bgcolor="yellow"></body> Daca puneti acest tag in pagina care ati creat-o veti abserva ca pagina are culoarea galben. Tocmai ati schimbat culoarea de fundal. Atentie , tagul <body> se pune o singura data intr-o pagina, nu de mai multe ori! Atributul bgcolor schimba fundalul unei pagini. Puteti sa-i dati ca valoare orice culoare in limba engleza. Cum ati vazut si mai sus coluarea yellow din exemplu, in engleza inseamna galben. Atributul align pozitioneaza un element. Ex: <h1 align="center"> - pune un text antet pe centru align="center" - aliniaza in centru align="left" - aliniaza la stanga align="right" - aliniaza la dreapta Dupa cum vedeti atibutul si valoarea se adauga unde se deschide tagul. De retinut ca: -un tag poate sa aiba oricate atribute; -unele taguri suporta doar anumite atribute; -atributele au valori standard; -exista diferente intre cum vede browserele atributele, adica Mozilla Firefox poate afisa pagina diferit de IE sau de alte browsere.

Text
Textul se poate introduce si fara taguri. Dar daca dorim sa avem un text de o anumita forma atunci in bagam in taguri ca si cele de mai jos: <font> </font> -intre ele se pune ce vrei sa scrii pe pagina (acest tag nu va schimba deloc forma textului)

<b> </b> -defineste test ingrosat sau- <ingrosat> </ingrosat> <big> </big> -defineste test mare; <mic> </mic> -defineste test mic; <em> </em> -defineste test accentuat; <i> </i> -defineste test italic; Anteturi: HTML adauga automat o linie goala in plus inainte si dupa un antet. <h1> </h1> -defineste un antet de cea mai mare marime; <h2> </h2> <h3> </h3> <h4> </h4> <h5> </h5> <h6> </h6> -defineste antetul de cea mai mica marime; Tagul <br> este folosit cand doriti sa intrerupeti un rand/linie , dar nu vreti sa incepeti un nou paragraf , forteaza o rupere de linie oriunde este asezat . Poate fi folosit pentru a lasa un rand liber . El este nepereche , neavand nevoie de tag de inchidere . &nbsp; -este folosit ca spatiu &copy; -copyright- &reg; -marca inregistrata- <!-- This is a comment --> -cu acest tag se scrie un comentariu in html source code , comentariu este ignorat de browser , pentru a vedea html source code apasa click right pe o pagina web si selecteaza "page source" .

Grafica html
C rea rea im p a c tu lu i v izu a l Cu toate c nu fiecare pagin are nevoie de o imagine, impactul vizual i aspectul sunt att de intrinseci culturii noastre, nct noi, uneori, vorbim despre caracterul, firea i comportamentul n public ale unei persoane ca despre imaginea acesteia. Pentru ca o pagin s capete personalitate, deseori are nevoie de o poz sau dou pentru a v informa despre ce este vorba i ce fel de informaii putei gsi n ea. Deci un sit despre maini de curse ar putea prezenta o fotografie a unui pilot lund o curb, sau un sit Web despre paradisul grdinarului ar putea afia fructele unei recolte generoase. Nu prea avem n Web moduri de a ne adresa simurilor noastre, n afar de vz, cel mai uor, i

auz, ntr-o msur mai mic, aa c trebuie s suprancrcm aceste simuri cu mult mai multe informaii dect n viaa obinuit. Experiena pe care o tria Marcel Proust nvluit de aroma cuptorului lui Madeline este ceva ce noi nu vom putea niciodat resimi n Web; cldura soarelui de var pe umeri i mireasma de pmnt proaspt spat sunt lucruri pe care nu putem dect s ni le nchipuim prin intermediul cuvintelor i al imaginilor, ca indicii. Dac cuvintele nu spun o poveste, este improbabil ca imaginile s vorbeasc de la sine, dar dup cum gesturile i expresiile fac diferena dintre un maestru povestitor i un amator, tot aa i imaginile pe care le folosim pentru a crea atmosfera unei pagini pot fi hotrtoare n a departaja o experien anodin de o senzaie antrenant de participare deplin. A d u g a r e a im a g in ilo r Adugarea imaginilor la o pagin web 1. Adugai imagini la paginile web cu eticheta pentru imagini <img>. Folosind atributul src pentru a indica fiierul imagine. <IMG src="exemplu.gif"> 2. Folosii atributele alt i longdesc pentru a prezenta informaii suplimentare despre imagine. <IMG src="exemplu.gif" alt="[Acesta este un exemplu]" longdesc="exempludescription.html"> <IMG src="exemplu.gif" alt="[O mica poza nu stric]" longdesc="exemplu-description.html"> Pont de folosire rapid: Sintaxa de etichet <IMG src="imgurl" height="imginaltime" width="imglatime" alt="alttext" longdesc="alttexturl" hspace="banda marginala" vspace= "banda marginala" border="margine de legtura" align="aliniere"> , unde imgurl reprezint adresa sursei imaginii; imginaltime reprezint nlimea imaginii n pixeli; imglatime este limea imaginii n pixeli; alttext reprezint o scurt descriere a imaginii - semnificativ sau nul, dac poate fi ignorat de browserele nevizuale; aittexturl este adresa unei descrieri mai detaliate a imaginii. Benzile marginale reprezint spaiul liber pe vertical i orizontal din jurul imaginilor; margine de legtura reprezint limea marginii n pixeli cnd imaginea este folosit ca legtur; i aliniere ia valorile left, right, top, middle sau bottom i modific poziia relativ a textului i imaginilor din pagin. S ncepem prin adugarea unei imagini la pagina noastr cu Hypatia, un portret al filozoafei aa cum arta ea probabil n tineree. Ne despart de timpurile ei attea secole i kilometri nct chiar i o idee vag despre cine a fost poate s ne-o apropie. Ne putem da seama c a fost ca noi, ca surorile noastre, ca mamele noastre; a crescut cu sperane i ambiii i totui soarta i-a fost umbrit, dup cum i pare i faa, trist i contemplativ, nu rznd nsufleit, cu toate c tnra femeie pe care o vedem a cunoscut desigur i zile de bucurie. Toate imaginile au de obicei aceeai etichet, eticheta de imagine, <img>, cu atributul obligatoriu src pentru a-i spune browserului de unde s ia imaginea propriu-zis. n plus, aproape toate imaginile ar trebui s aib un scurt text descriptiv n atributul alt, pentru a face pagina mai uor accesibil celor cu deficiene de vedere sau celor care pur si simplu prefer s navigheze cu un browser audio, poate cineva care se plimb cu maina pe autostrad. Dac imaginea este pur decorativ, aceast valoare trebuie stabilit explicit ca nul scriind alt="". Acestea sunt singurele atribute care sunt cu adevrat pentru orice imagine. Versiunea HTML 4.0 a adugat atributul longdesc, care v permite s introducei o adres URL la care s mearg browserul pentru mai multe informaii despre o imagine. Ai putea folosi aceast capacitate pentru a oferi o descriere narativ complet sau chiar o list cu capitole despre istoria imaginii, originea ei i o scurt biografie a artistului.

S ncepem, completnd cu rbdare pagina cu un titlu adecvat i de asemenea cu imaginea pe care dorim s o folosim. Vom evoca imaginea cu eticheta <img>, adugnd atributul source, ca i cele dou atribute descriptive. Exemplu: <HTML> <HEAD> <TITLE>Hypatia: un om de tiina remarcabil</TITLE> </HEAD> <BODY> <IMG src="hypatia.gif" alt="[Hypatia tnra]" longdesc="hypatia-description.html"> <Hl>Hypatia</Hl> <H2>O relaie personala cu istoria</H2> <P> <STRONG>Hypatia</STRONG> este deseori pictata in <IXDFN title="tunica">tribon</DFNx/I>, un vemnt al clasei muncitoare srace fcut din materiale de proasta calitate, care era inuta tradiionala a filosofilor si a asceilor. Insa aceasta este in multe privine o idee <EM>foarte</EM> controversata si unii savani cred ca ea ar fi fost mbrcata in stilul femeilor din inalta societate greaca din Alexandria romana trzie, inca foarte mult influenat de Grecia elenistica, cu <!><DFN title="camasa fr maneci">chiton</DFNX/I> tipic si <!><DFN title="roba pana la glezne"> peplos </DFNX/I> ncins cu bru cu <! ><DFN title="mantie drapata">himation</DFN> </I>. Din acest punct de vedere, mbrcmintea de calitate proasta in care este prezentata constituie o minciuna pioasa a admiratorilor ei de mai trziu, pentru a slavi si a da ca exemplu cultura, altruismul si puritatea ei. Dup toate sursele credibile, ea a rmas toata viata fecioara si si-a dedicat viata tiinei si matematicii; adepii ei au fost muli si si-au proclamat cu trie admiraia de-a lungul secolelor, din ziua in care a fost ucisa in anul 415, <ABBR title="dupa Hristos"> d.Hr. </ABBR>. </BODY> </HTML> C o ntrolu l m rim ii im ag in ii C on trolai m rim ea im aginii p e pagin cu atrib ute sim ple 1. Folosind un program de grafic pentru a determina mrimea i limea imaginii. 2. Folosind atributele height (nlime) i width (lime) pentru a controla mrimea imaginii pe pagin. <IM src="hypatia.gif" alt="[H G ypatia as a young w an]" om longdesc="hypatia-description.htm l"> height="243" w idth="200" Acum atributele vin multe i cu furie i majoritatea imaginilor au nevoie de aproape toate, deoarece imaginile se numr printre cele mai complexe obiecte de pe pagin si trebuie mult migal pentru a obine cele mai bune rezultate. Vom face mai multe ncercri cu eticheta <img> pentru a gsi mrimea cea mai potrivit pentru imagine nainte de a o modifica pe aceasta, astfel c voi meniona doar liniile cu eticheta <img>, pentru a economisi spaiu. Mai nti vom reduce dimensiunile imaginii prin micorarea numerelor de la atributele height i width. Browserul va ignora mrimea implicit a imaginii i o va fora s se ncadreze n noile dimensiuni pe care i le dm. Puterea suprem. Luai aminte c aceasta este o metod temporar, doar pentru a vedea cum va arta imaginea la o dimensiune mai mic. n versiunea noastr definitiv vom redimensiona imaginea pentru a nu pierde mai mult timp dect necesar la ncrcarea ei. <IMG src="hypatia.gif" alt="[Hypatia as a young woman]" longdesc="hypatiadescription.html"> height="243" width="200" n ca d ra r ea im a g in ilo r cu tex t F o rm atarea p agin ilor astfel ca textu l s ncad reze im aginile 1. Se determin unde se dorete plasarea textul n raport cu imaginea.

2. Folosind atributul align pentru a muta imaginea n raport cu textul la stnga (left), la dreapta (right), sus (top), la mijloc (middle) sau jos (bottom). <IM src="hypatia2.gif" alt="[Hypatia as a young wom G an]" longdesc="hypatia-description.html"> height="243" width="200" align="right"> U tiliza rea im a g in ilo r ca leg tu ri T ran sform area im aginilor n legturi 1. Includei imaginea n pagina dumneavoastr. <IM src="alslogo.gif" alt="[ALSLogo]"> G 2. Transformai o imagine n legtur pur i simplu incluznd-o n coninutul descriptiv al etichetei ancor (<A>). < href ="developers.htm IM src="logo.gif " a A l"X G lt= L "[A S L ogo]" longdesc="als-description.htm border="0" l" height="100" w idth="100" align="left"x/A > Dup introducerea unei seciuni antet i a unui titlu pe pagin, ncadram imaginea emblemei ntr-o etichet ancor. Eticheta imagine se va afla n interiorul etichetei ancor, exact ca n legturile de text pe care le-am fcut mai devreme, i putem s le folosim pe amndou. Ca ntotdeauna cnd este vorba de imagini, dar n special acelea care fac ceva, am folosit text alternativ clar pentru a informa pe aceia care folosesc browsere nevizuale despre coninutul fotografiilor, mi place s pun textul alternativ n paranteze ptrate - cu toate c numai eu fac asta - deoarece n acest mod difer de textul obinuit, dac este vizualizat cu browserul Lynx. <HTML> <HEAD> <TITLE>Aristotelian Logical Systems, Ltd.</TITLE> </HEAD> <BODY> <A href="developers.html"><IMG src="alslogo.gif" alt="[ALS Logo]" longdesc="als-description.html" border="0" height="100" width="100" align="left"X/A> <Hl>Aristotelian Logical Systems, Ltd.</Hl> <BR clear="left"> <BR> <P> <STRONG>ALS</STRONG> is a world leader in machine translation software and offers the most comprehensive suite of translation engines with the best recognition of idiomatic constructs in the known universe. <P> We want to help you, our present customers, as well as others interested in seeing how ALS products can power up international businesses as well as improve communications between the farflung offices of global and trans-national businesses. <P> Explore our site: <DL> <DTXDDXA href="alsfaq.html">Company Fact Sheet</A> <DTXDDXA href="alsprods.html">Product Information</A> <DTXDDXA href="alssales.html">Contact Sales and Marketing</A> <DTXDDXA href="alsitpstatus.html">Intelligent Translation Prototype Product Status</A> <DTXDDXA href="alssupport.html">24-hour by 7-day Customer Support</A> <DTXDDXA href="alshistory.html">The History of Machine Translation</A> </DL> <ADDRESS> Contact the Webmaster: <A href="mailto;Webmaster@ALSLtd.com"><STRONG> Webmaster@Ltd.geninet.ro.com</STRONGx/A> </ADDRESS> </BODY> </HTML> A fiarea im agin ilo r m in iatu rale pen tru a m bu n tin c rca re tim p u l d e U tiliza rea im ag in ilo r m in iatu rale

1. Folosind un editor de imagine, micorai dimensiunile imaginilor mari i salvai-le separat ca poze miniaturi. 2. Plasai aceste poze miniaturale pe paginile dumneavoastr Web i legai-le la paginile care conin versiunea mai mare a pozei. <Ahref ="hypatia.gif "X G src="hypatia-thum IM b.gif " alt="[H ypatia Thum bnail Im age]" longdesc="hypatia-description.html" border="2" height="49" width="40"x/A> <A href="hypatia.gif "XIMG src="hypatia-thumb.gif" alt="[Imaginea miniatura a Hypatiei]" longdesc="hypatia-description.html" horder="2" height="49" width="40"x/A> Culminarea logic a acestor tehnici de navigare este s creai o pictogram care se refer la o versiune mai mare a fotografiei propriu-zise. Acest fel de miniatur de autoreferire se numete (N.R. - n limba englez) thumbnail (unghia de la degetul mare) deoarece este aa de mic nct putei s o pictai pe unghia de la degetul mare al minii. Nu vom face mare caz din asta, deoarece tii deja s navigai cu pictograme. Iat un exemplu simplu care folosete celebra noastr imagine a Hypatiei. Am ales s ncarc imaginea de tip GIF direct, dar puteam la fel de bine s ncarc o pagin HTML cu informaii despre portret. <HEAD> <TITLE>Hypatia marita</TITLE> </HEAD> <BODY> <A href="hypatia. gif "XIMG src="hypatia-thumb. gif" alt="[Hypatia Thumbnail Image]" longdesc="hypatia-description.html" border="2" height="49" width="40"x/A> <Hl>Legatura ctre portretul mare al Hypatiei</Hl> </BODY> </HTML> S im u la r ea fo n tu rilo r ex o tice cu a ju to ru l g ra fic ii Inclu derea n situ l d um n eavoastr a fon tu rilor din afara sistem ului ca im agini grafice 1. Folosind un program de pictur sau desen, creai cu instrumentul de text textul n fontul dorit i salvnd ca grafic. 2. Folosind eticheta <img> pentru a ncrca grafica n pagina Web. <IM src="greek-font.gif" alt="[Greek saying]"> G <IM src="greekG font.gif" alt="[Limba greaca]"> Procedura exact de realizare a acestui lucru variaz pentru diferitele pachete de grafic, dar n general va trebui s avei avei instalat pe calculator fontul pe care dorii s l folosii, s creai un nou fiier de grafic destul de mare pentru ct text scriei i ce dimensiuni i stabilii, s folosii programul de pictare a textului - sau cum se cheam programul dumneavoastr - pentru a insera textul (i s sperm c tim ce facem) i apoi s aranjai imaginea de care este nevoie. Unul dintre lucrurile pe care adesea va trebui s le facei este s fixai distana dintre litere, un proces numit spaiere selectiv (kerning), deoarece eliminai colurile dreptunghiului alb care ncadreaz o liter. Candidaii tipici pentru spaierea selectiv sunt W i A, A i V i orice alt combinaie de litere care arat cam prea deprtate n comparaie cu restul literelor.

U tilizarea eficien t a im aginilor de fu nd al 1. Pentru a aduga o imagine de fundal la pagina dumneavoastr folosii atributul background (fundal) al etichetei <BODY>. <BODY background="parchment.jpeg">

2. De obicei este bine s folosii att atributul background ct i atributul bgcolor, deoarece alegerea unei culori de fond apropiate de tonurile generale din imagine amelioreaz aspectul unei pagini la ncrcare i de asemenea ajut la prevenirea problemelor la browserele care nu ncarc imagini. Mai nti se va afia culoarea de fond i apoi se va suprapune imaginea de fond peste ea. <BODY background="parchment.jpeg" bgcolor="F7F!F2"> Pont de folosire rapid: Sintaxa de etichet <BODY background ="imgurl" bgcolor =" culoare"> unde imguri este adresa sursei imaginii i culoare este o culoare apropiat de imagine pentru a asigura o tranziie mai lin n cursul ncrcrii imaginii de fundal. U tiliza rea im a g in ilo r p en tru a fu rn iz a r ep er e v izu a le Codul de mai jos ilustreaz conceptul de introducere a unor semne pentru a ajuta vizitatorii s se orienteze n situl grupului de lucru. Am pus totul laolalt pentru a economisi spaiu, dar fiecare emblem i antet apar n principiu n partea de sus a fiecrei pagini de care aparine. Micile bare de jos se ncarc foarte eficient i, cnd se combin cu emblema principal, dau o frumoas continuitate ntre pagini, ca i diferenieri ntre seciuni. <HTML> <HEAD> <TITLE>Aristotelian Logical Systems, Ltd.</TITLE> </HEAD> <BODY background="parchment.jpeg" bgcolor?="F7FlF2"> <IMG src="alslogo.gif" alt="[ALS Logo]" longdesc="als-description.html" border="0" height="100" width="100" align="left"> <H1 align="center">ALS Support</Hl> <BR clear="left"> <IMG src="alssupport.gif" alt="[ALS Support]" longdesc="als-description.html" border="0" height="20" width="100" align="left"> <BR clear="left"> <BR> <HR> <P> <IMG src="alslogo.gif" alt="[ALS Logo]" longdesc="als-description.html" border="0" height="100" width="100" align="left"> <H1 align="center">Machine Translation History</Hl> <BR clear="left"> <IMG src="alshistory.gif" alt="[ALS History]" longdesc="als-description.html" border="0" height="20" width="100" align="left"> <BR clear="left"> <BR> <HR> <P> <IMG src="alslogo.gif" alt="[ALS Logo]" longdesc="als-description.html" border="0" height="100" width="100" align="left"> <H1 align="center">ALS Special Projects</Hl> <BR clear="left"> <IMG src="alsprojects.gif" alt="[ALS Projects]" longdesc="als-description.html" border="0" height="20" width="100" align="left"> <BR clear="left"> <BR> <HR> <P> <IMG src="alslogo.gif" alt="[ALS Logo]" longdesc="als-description.html" border="0" height="100" width="100" align="left"x/A> <H1> align="center">Aristotelian Logical Systems, Ltd.</Hl> <BR clear="left"> <BR> <P> <ADDRESS> Contact the Webmaster: <A href="mailto;Webmaster@LTD.geniusnet.ro"><STRONG> Webmaster@Ltd.geniusnet.ro</STRONGX/A> </ADDRESS> </BODY> </HTML>

G sirea u n ei m e ta fo re v izu a le a d ecv a te C rearea hrilor im agine 1. ncepnd prin ncrcarea fiierului grafic folosit ca hart imagine. Specificai numele coordonatelor care se folosesc, cu atributul usemap. <IM src="09fig01-kansasfarm G -1913.jpg" alt="[B unicul intr-o echipa de treierat in K ansas, 1913]" longdesc="kansasfarm -1913.htm l" usem ap="#kansasfarm w " idth= "450" height= "321" border= "0"> 2. Definii harta cu o etichet hart, <map>. Folosii atributul name pentru a defini harta pentru referin. Numele trebuie s corespund atributului usemap din eticheta <img>, cu excepia simbolului #. <MAP name="kansasfarm"X/MAP> 3. Folosii programul dumneavoastr de grafic pentru a identifica coordonatele imaginii. Reinei aceste coordonate pentru a le folosi n cadrul atributului coords din eticheta <area>. 4. Identificai cu etichetele <area> zonele de pe harta imagine incluznd un atribut nohref pentru a acoperi ntreaga suprafa i a fi anulat de zonele alese. <IMG src="image.jpg" usemap="imagemap"> <MAP name="iinagemap"> <AREA shape="rect" coords="0, O, 50, 50" href="firs tarea.html"> <AREA shape="rect" coords="60, O, 80, 50" href=" seconda rea.html"> </MAP> <A EA shape="form suprafeei" coords="lista coordonate" R a href= "url harta" nohref> unde forma suprafeei poate fi circ, rect sau poly; lista coordonate este O list de coordonate separate prin virgul care definesc forma; uri harta este destinaia legturii reprezentate de hart; i nohref este o valoare implicit care nu are nici un efect. A tragei aten ia cu anim aii A d ug area de m icare i d e via prin includ erea an im aiilor G IF 1. Creai animaii GIF sau mprumutai-le din Internet. 2. Adugai-le paginilor cu eticheta de imagine, ca nite imagini obinuite. <IM src="kitty.gif" height="" width="" alt="[Kitty]> G <HTML><BODY>< G src "k .g IM = itty if" h ig t= w th "" e h "" id = a "[K ]> lt= itty </BODY> </HTML> Afiarea nu este nc ceea ce-i dorete ea, dar se apropie. Animaia cu pisicua atrage atenia, dar nu prea are legtur cu subiectul. Este doar un kitsch ntmpltor care distrage atenia de la mesajul de baz. Dac subiectul paginii ar fi fost Secrete pe care pisica dumneavoastr ar dori s le tii", ar fi foarte potrivit, dar avnd n vedere

circumstanele, Bess rezist tentaiei de a folosi imaginea, chiar dac pisicua este foarte drgu.

F o lo sir e a fiie r e lo r .W A V si .A U A d u g ar ea d e efecte so n o re d e b a z 1. Adugai sunete cu eticheta pentru obiecte, <object>, care reprezint modul general de includere a coninutului non-text. Avem la dispoziie mai multe opiuni prin imbricarea etichetelor pentru obiecte. <OBJECT data="suneturl" type="audio/tipm i/ne" height="inaJtiffle" vridth= latim " e"> ... coninut alternativ pentru brow serele care nu accepta obiecte, eventual o eticheta im bricata pentru obiecte... < B C> /O JE T unde suneturl este adresa URL a fiierului de sunet; tipmime este unul dintre tipurile MIME audio; iar inaltime i lime sunt valorile de anulare ale nlimii i limii imaginii implicite a cadranului cu butoane pentru controlul redrii sunetului. <O BJECT data="greetings.wav" type="audio/wav" width="145" height="60"> 2. Adugai un pic de simpuls" cu o etichet <param> imediat dup deschiderea etichetei pentru obiecte. <PARA nam M e="autostart" value="true"> unde name i value sunt valori Netscape care fac ca aplicaia s porneasc singur n loc s se ncarce i s atepte utilizatorul s o porneasc. <O BJECT data="greetings.wav" type="audio/wav" width="145" height="60"XPARAM nam e="autostart" value="true"> </OBJECT> 3. Oferii coninut sonor alternativ la nivelul cel mai central de imbricare al etichetei pentru obiecte, cu eticheta <embed>. <EM BED src=" suneturl" type=" tipmim e" height="inaltim e" width="latim hidden="valoare" autostart="autovaloare"> e" unde suneturl este adresa URL a fiierului surs de sunet; tipmime este tipul coninutului MIME al datelor pe care modulul plug-in i le va aduce sau le va conine; inal time i lime sunt mrimile pentru cadranul cu butoane, dac exist; si autovaloare nu este nul dac dorii ca sunetul s porneasc automat. Este obligatoriu fie atributul src, fie type, iar height i width se recomand n afar de cazul n care obiectul nglobat este ascuns. Atributul hidden este opional i controleaz dac programul de sunet este vizibil; valoare poate fi true sau false. <OBJECT data="greetings.wav" type="audio/wav" width="145" height="60"> <PARAM name="autostart" value="true"> <EMBED src="greetings.wav" type="audio/wav" width="145" height="60"> </OBJECT> 4. Oferii coninut alternativ pentru browserele care nu accept obiectele sau sunetele nglobate, cu eticheta <noembed>. <NOEMBED>... coninut alternativ pentru browserele care nu accepta obiecte nglobate sau sunete... <NOEMBED> 5. Oferii coninut sonor alternativ pentru Microsoft Internet Explorer cu eticheta <bgsound>.

<BGSOUND src="suneturl" loop="numar"> unde sunaturi este adresa URL a fiierului surs de sunet i numr este numrul de ciclri, dac este cazul. Valoarea -l spune browserului s cicleze sunetul ncontinuu. Acest atribut este opional, dar recomandabil, deoarece browserul poate verifica tipul fiierului ca s vad dac tie ce s fac cu el nainte de a-1 ncrca i astfel economisete timpul pentru utilizatorii care nu sunt interesai. Celelalte atribute recomandate sunt height i width, dar pe acestea nu le tim dinainte, deoarece redarea este fcut de ctre un plug-in al browserului. Va trebui s dai valori la ntmplare, pe ghicite (acestea sunt 145x60). Tabelul 11.1 prezint tipurile MIME de baz pe care s-ar putea s le accepte browserul dumneavoastr. T ip uri IM E u d io d e b a z pen tru _______________________________________ M a su net .wav audio/wav Platforme Windows .wav audio/x-wav Platforme Windows .au audio/basic Platforme UNIX i altele .aiff audio/aiff Platforme Macintosh .aiff audio/x-aiff Platforme Macintosh A d u g ar ea d e m u z ic n p a g in ii c u fiiere d e tip M ID I 1. Adugai fiiere de tip MIDI (Musical Instrument Digital Interface), care cuprind multe sunete ntr-un fiier mic. Pot fi oferite mai multe opiuni prin imbricarea etichetelor <objectx <OBJECT data="homesweethome.mid" width="145" height="60"> </OBJECT> 2. Adugai un mic impuls iniial" cu o etichet <param> imediat dup deschiderea etichetei DBJECTX DBJECT data="homesweethome.mid" width="145" height="60"> <PARAM name="autostart" value="true"> </OBJECT> 3. Oferii coninut sonor n cel mai adnc nivel de imbricare al etichetei <OB JECT>, cu eticheta <embed>. 4. Oferii coninut alternativ pentru browserele care nu accept obiecte sau sunete nglobate, cu eticheta <noembed>. 5. Oferii coninut sonor pentru Microsoft Internet Explorer cu eticheta <bgsound>. <OBJECT data="homesweethome.mid" width="145" height="60"> <PARAM name="autostart" value="true"> <EMBED src="homesweethome.mid" width="145" height="60"> <NOEMBED> <P> [In fundal se deruleaz o muzica . ]<BR> <A href="homesweethome. mid">Get the MIDI file!</AXBR> </NOEMBED> </OBJECT> <BGSOUND src="homesweethome.mid"> Un fiier MIDI se folosete exact la fel ca un fiier WAV sau AU, prin includerea sa ntre etichetele potrivite.

Elemente video html


C u ms fo lo sim u ic k T im eA V I p e n tr u a a d u g a e le m e n te v id e o Q i A d u g a r e a d e e le m e n te v id e o c u Q u ic k T im e sa u c u A V I 1. Adugai secvene video unei pagini Web cu aceleai etichete pe care le folosii pentru fiierele audio, dar atent, fiierele video pot fi uriae! Avei mai multe opiuni prin imbricarea etichetelor <ob ject>. Pont de folosire rapid: Sintaxa de etichet <OBJECT data="videourl" type="video/tipmime" height="inaltimeinig" width="latimeimg"> ... coninut alternativ pentru browserele care nu accepta obiecte, eventual o eticheta de obiect im bricata... </OBJECT> unde videourl este adresa URL a fiierului video; tipmime este unul dintre tipurile MIME video; iar inaltimeimg i latimeimg sunt valori care anuleaz nlimea i limea implicite ale imaginii. <OBJECT data="homesweethome.avi" width="300" height="200"> </O BJECT> 2. Adugai un mic impuls iniial" cu o etichet <param> imediat dup deschiderea etichetei <OBJECT>. <OBJECT data="homesweethome.avi" width="300" height="200"> <PARAM name="autostart" value="true"> </O JEC B T> 3. Oferii coninut video la cel mai adnc nivel de imbricare al etichetei <object>, cu eticheta <EMBED>. <E B D ME src-"videourl" type="video/tipm e" im height="inalti/neirag" w idth="la tim g" eim hidden=" valoare" autostart="autovaloare" controller=" valoare" loop=" valoare" > unde videourl este adresa URL a fiierului surs video; tipmime este tipul MIME al datelor pe care le va aduce sau le va conine modulul plug-in; inaltimeimg i latimeimg sunt mrimile pentru afiare, dac exist; i autovaloare este true dac dorii ca imaginea video s porneasc automat. Este obligatoriu unul din atributele src sau type, iar height i width sunt recomandate n afar de cazul n care obiectul nglobat este ascuns. Atributul hidden este opional i controleaz dac programul de redare video este vizibil; atributul controller regleaz apariia pe ecran a butoanelor de lucru; si loop controleaz dac secvena video se va repeta sau nu; valoare poate fi true sau false. <BODY> <OBJECT data="homesweethome.avi" width="300" height="200"> <PARAM name="autostart" value="true"> <EMBED src="homesweethome.avi" width="300" height="200"> </OBJECT> <BGSOUND src="homesweethome.avi"> </BODY> 4. Oferii coninut alternativ pentru browserele care nu accept obiecte sau elemente video nglobate, cu eticheta <noembed>. <OBJECT data="homesweethome.avi" width="300" height="200">

<PARAM name="autostart" value="true"> <EMBED src="homesweethome.avi" width="300" height="200"> <NOEMBED> <P> [Imagini video sentimentale] <R B> <A href="homesweethome.avi">Get the AVI file!</A> < R B> </NOEMBED> </OBJECT> 5. Oferii coninut alternativ video pentru Microsoft Internet Explorer cu atributul dynsrc al etichetei pentru imagine. Acesta v ofer opiunea de a include o imagine static pentru alte brow sere. T ip u r i M IM E v id e o Tipuri M IM E video pentru film e .mpeg video/mpeg Video Motion Picture Experts Group pentru orice platform .mpg video/mpeg Video Motion Picture Experts Group pentru orice platform .mpe video/mpeg Video Motion Picture Experts Group pentru orice platform .mpv video/mpeg Video Motion Picture Experts Group pentru orice platform .vbs video/mpeg Video Motion Picture Experts Group pentru orice platform .mpa video/mpeg Video Motion Picture Experts Group pentru orice platform .mpegv video/mpeg Video Motion Picture Experts Group pentru orice platform .mov video/quicktime Video QuickTime pentru orice platform .avi video/avi Video Windows pentru platforme Windows .avi video/x-msvideo Video Windows pentru platforme Windows

Miniaplicatii Java in html


Includerea m iniaplicaiilor Java S n ele g e m ce este J a v a Java reprezint ori cel mai important lucru aprut vreodat n Web, ori cea mai mare campanie publicitar de la rzboiul Betamax/VHS ncoace - dumneavoastr decidei. Java este subiectul unor controverse att legale, ct i teoretice, cu toate c principiul su de baz este att logic, ct i rezonabil. Java ruleaz pe un calculator virtual idealizat, implementat prin software n loc de hardware, astfel nct poate fi uor emulat pe alte calculatoare. Singura chichi este c vnztorul sistemului de operare al mainii reale trebuie s fie de acord s furnizeze suport Java. Java este un standard deschis care, dac toi vnztorii l vor susine cu bun credin, va nsenina pn la urm c vei putea cumpra aplicaii care s funcioneze direct pe orice calculator din lume. Ce nseamn exact acest pn la urm" este cu adevrat punctul de poticnire, deoarece situaia actual este mult mai complex dect ar vrea s recunoasc muli dintre partizanii programului Java. Standardele contradictorii i implementrile incomplete sau defectuoase au schimbat promisiunea iniial a viziunii firmei Sun Microsystems din scrie o dat, ruleaz oriunde" n scrie o dat, testeaz peste tot", dup unii programatori. Implementrile incorecte ale browserelor duc la riscul ca Java s devin incomod i enervant pentru utilizatorii dumneavoastr, dac programele nu sunt realizate cu atenie i izolate pe cteva pagini speciale sau n terenuri de joac" Java, pe care cei crora nu le place Java pot s le evite. Printre probleme se numr i browserele care aloc aplicaiilor Java resurse ale sistemului i nu le mai elibereaz, ceea ce duce, n cel mai ru caz, la prbuiri ale sistemului sau, n cel mai bun caz, la ncetinirea sa; miniaplicaiile (applets) Java care arunc mesaje de eroare derutante pe ecranele utilizatorilor, pe care nu le putei controla i nu avei cum s le descoperii fr o testare exhaustiv; i browserele, sau chiar sisteme, care se blocheaz neateptat n timpul ncrcrii miniaplicaiilor Java, necesitnd o reiniializare a sistemului pentru a continua lucrul. Problemele par mai mari pe platforma Windows 95, datorit vechimii sistemului de operare, dar nici un sistem nu este imun. Versiunile urmtoare ale sistemului Windows poate vor rezolva unele probleme, dar nu se tie ct de cooperant va fi Microsoft. Pe de alt parte, Java ar putea reprezenta pn la urm sfritul acelor enervante module plug-in care nfulec resursele sistemului, ncetinesc lansarea browserelor i n general fac viaa dificil cnd navigai prin Internet. Dar cea mai bun veste este c putei gsi cu uurin n Web miniaplicaii Java care pot fi folosite gratuit sau pentru o sum mic de bani, deci nu trebuie s nvai s programai n limbajul Java. A d u g a rea d e m in ia p lica ii J a v a la p a g in ile W eb A dugarea de m icare i interactivitate sitului fr servere p lu g-in costisitoare 1. Studiai notele de utilizare ale miniaplicaiei Java nainte de a o folosi. 2. Inserai o etichet <ob ject> referitoare la miniaplicaie, mpreun cu toi parametrii pe care i va necesita miniaplicaia. <OEJECT classid="lake.class"

align="right" border="0" codebase="/java" width="251" height="260"> <PARAMnam e="im age" value="/im ages/sfskyline.jpg"> 3. Adugai de asemenea eticheta <applet>, mpreun cu parametrii si, pentru a acoperi ct mai multe situaii. <APPLET code="lake.class" align="right" border="0" codebase="/java" width="251" height="260"> <PARAM nam e="im age" value="/im ages/sfskyline.jpg"> <OBJECT classid="/iujneclasa" codetype=" tipcod" codebase="bazaurlpentrucod" azchive="listacodarhiva" data="da teurl" type=" tipmime" height=" inaltimeimg" width="la timeimg" standby=" text de afiat cnd se ncarc miniaplicatia"> ...coninut alternativ pentru browserele care nu accepta obiecte, eventual o eticheta pentru obiecte imbricata.. .</OBJECT> unde numeclasa este numele obiectului; tipcod este tipul MIME al codului; bazaurlpentrucod este adresa de baz unde se afl obiectul; listacodarhiva este o list de arhive separate prin spaiu; da tauri este adresa URL a unui eventual fiier de date de care are nevoie miniaplicaia; tipmime este tipul MIME al datelor; iar inaltimeimg i la timeimg sunt valorile care anuleaz nlimea i limea implicite ale imaginii. <APPLET code=" numeclasa" ob^ect="miniaplicatieseriala" codebase=" bazaurlpentrucod" archive="listacodarhiva" data="da teurl" type=" tipmim e" height="inalti.m g" width="latim g" eim eim standby=" text de afiat cnd se ncarc miniaplicatia" nam e="nujne"> ...coninut alternativ pentru browserele care nu accepta obiecte, eventual o eticheta pentru obiecte imbricata... </APPLET> 4. Testnd miniaplicatia folosind ct mai multe browsere, versiuni i sisteme de operare. Deci, ne trezim cu ceva numit lake.class. Ei bine, o clas este ceea ce programatorii n Java numesc un program, deci acel lucruor este exact ce ne dorim n directorul n care se afl pagina noastr. Acum suntem gata s inserm miniaplicatia n pagina noastr. Pentru imaginea noastr vom alege Palatul Navigaiei a oraului Galai. Plasnd poza dup un lac, crem impresia Dunrii propriu-zis, efect foarte potrivit att cu subiectul ct i cu pagina, ce delecteaz totodat privirea i hrnete imaginaia. Iat bucica de cod pe care o vom insera n pagin. <OBJECT classid="lake.class" align="right" border="0" codebase="/java" width="251" height="260"> <PARAM name="image" value="/images/sfskyline.jpg"> <APPLET code="lake.class" align="right" border="0" codebase="/java" width="251" height="260"> <PARAM name="image" value="/images/sfskyline.jpg"> <p align="left"> <table> <tdalign="center">

<P> <font size="6"> <font face="Arial, Helvetica"> [Imaginea prezint o imagine a oraului Galati reflectata in Dunare] </font> </font> </td> </table> </APPLET> </OBJECT> Acest cod are dou elemente, noua etichet <object> din HTML 4.0 i eticheta mai veche <applet>, amndou oferind numele clasei (sau al programului), alinierea (dreapta), chenarul (0) i o baz pentru coduri, un director special n care punem miniaplicaiile noastre Java. Apoi furnizm miniaplicaiei un parametru care identific imaginea pe care vrem s o folosim, imagine pe care o plasm n alt director special.

Link-uri si Ancore
HTML foloseste un hiperlink pentru a se lega de alt document web. HTML foloseste tagul ancora sau <a> pentru a crea un link catre alt document . O ancora poate duce catre orice resursa de pe Web: o pagina HTML, o imagine, un fisier sunet, un film etc . <a href="url"> Textul ce va fi afisat </a> Textul ce va fi afisat Cu atributul target, puteti indica unde sa deschideti documentul catre care se face link-ul. Linia de mai jos va deschide documentul intr-o noua fereastra de browser: <a href= "url" target= "_self" > Textul ce va fi afisat </a > target= "_self" Incarca noul document in aceeasi fereastra cu ancora (implicit). target= "_parent" Incarca noul document in cadrul cadrul de baza . target= "_top" Incarca noul document in intreaga fereastra de browser. target= "_blank" Incarca noul document intr-o fereastra noua. Puteti sa combinati tag-ul imagine cu cel de ancora si sa puneti un link pe imagine, puteti face un buton. <a href= "url" target= "_self" ><img src=""> </a > Link catre o sectiune: <a name= "Paragrafele"> Paragrafele </a>(se pune unde este sectiunea pt a marca) Sectiunea cu paragrafe Mail link: <a href= "mailto:lucian0308@yahoo.com" >Send Mail <a >

Tabele
Cu HTML se pot crea tabele. Tabelele se definesc cu tagul <table>. Un tabel este divizat in randuri (cu ajutorul tagului <tr>) si fiecare rand este impartit in celule de date (cu ajutorul tagului <td>). Td inseamna "table data" si este continutul unei celule de date. O celula de date poate contine text, imagini, liste, paragrafe, formulare, linii orizontale, tabele etc. <table border="1"> <tr> <td>randul 1, celula 1 </td> <td>randul 1, celula 2 </td> </tr> <tr> <td>randul 2, celula 1 </td> <td>randul 2, celula 2 </td> </tr> </table> randul 1, celula 1 randul 1, celula 2 randul 2, celula 1 randul 2, celula 2

Daca border="0" tabelul va exista dar va avea border-ul invizibil. Si cu cat nr border-ului va creste border-ul va fi mai ingrosat. <table>Defineste un tabel. <th>Defineste o celula cap de tabel. <tr>Defineste un rand de tabel. <td>Defineste o celula din tabel. <captation>Defineste un camp asociat tabelului pentru introducerea unei explicatii. <colgroup>Defineste grupuri de coloane ale tabelului. <col>Defineste valorile atributului pentru una sau mai multe coloane dintr-un tabel. <thead>Defineste un cap de tabel care nu se va derula. <tbody>Defineste corpul unui tabel care se desfasoara in interiorul unui cap de tabel fixat si subsolul tabelului. <tfoot>Defineste un subsol de tabel care nu se va derula.

Liste
Html suporta liste neordonate si ordonate. Ex de lista neordonata: <ul> <li>element1 </li> <li>element2 </li> </ul> Prin <ul type=""> semnul din fata poate fi modificat. <ul type="disc"> , <ul type="circle"> , <ul type="square"> Ex de lista ordonata: <ol> <li>element1 </li> <li>element2 </li> </ol> Initial in fata va aparea 1. , 2. .Prin type"A" se va schimba in A. , B. , C. ,etc. type"a" se va schimba in a. , b. , c. ,etc. type"I" se va schimba in I. , II. , III. ,etc. type"i" se va schimba in i. , ii. , iii. ,etc.

Cadre
Cu ajutorul cadrelor, se poat afisa mai multe pagini web in aceeasi fereastra de browser. Fiecare document HTML poarta numele de cadru (frame) si fiecare cadru este independent de celelalte. <frameset cols="30%,70%"> <frame src="pagina1 name="left"> <frame src="pagina2 name="right"> </frameset> <frameset> Defineste un set de cadre. <frame> Defineste o sub-fereastra (un cadru). <noframes> Defineste o sectiune noframei. <iframe> Defineste o sub-fereastra inline.

Formulare

Formularele HTML sunt folosite pentru a selecta diferite moduri de introducere a datelor de catre utilizator. Se pot introduce informatii ca: (campuri text, meniuri ce se pot derula, butoane radio, casute de validare, etc.). Un formular se defineste cu tagul <form>. Text: <form> Nume: <input type="text" name="nume"> <br> Prenume: <input type="text" name="prenume"> </form> Radio buton: <form> <input type="radio" name="sex" value="male"> Male <br> <input type="radio" name="sex" value="female"> Female </form> Checkbox: <form> Am un caine: <input type="checkbox" name="animal" value="caine"> <br> Am o pisica: <input type="checkbox" name="animal" value="pisica"> </form> Formular cu actiune: <form name="input" action="html.php" method="get"> Username: <input type="text" name="user"> <input type="submit" value="Submit"> </form>

Codul sursa:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Rase de caini</title> <meta name="keywords" content="free website templates, Dog Website, XHTML CSS" /> <meta name="description" content="Dog Website - free website template, Free XHTML CSS Layout" /> <link href="templatemo_style.css" rel="stylesheet" type="text/css" /> <!-- This website template is designed by TemplateMo.com --> <style type="text/css"> <!-.style2 {color: #ff8c05} .style4 { color: #fc9109; font-weight: bold; } .style5 {color: #FFFF00} .style6 {color: #fc9109} a:link { color: #FFFFFF; } body { background-color: #FFFFFF; } --> </style> </head> <body> <div id="templatemo_container"> <div id="templatemo_header_section"> <div id="templatemo_topmenu"> <ul> <li><a href="gr8.html">Vanatoare</a></li> <li><a href="gr9.html">Agrement</a></li> <li><a href="gr10.html">Ogari</a></li> </ul> </div> </div> <div id="templatemo_content_section"> <div id="templatemo_menu"> <ul> <li><a href="index.html" class="current">Home</a></li> <li><a href="gr1.html">Ciobanesti</a></li> <li><a href="gr2.html">Paza</a></li> <li><a href="gr3.html">Terrieri</a></li> <li><a href="gr5.html">Tipuri primitive</a></li> </ul> </div> <div class="templatemo_content_1"> <h1 id="firstHeading">Grupe</h1>

<h1>&nbsp;</h1> <div class="contents"> <div class="news">

<img alt="Dog" src="images/templatemo_section_1_img_1.jpg"/> <div class="textarea style2"> <p><a href="gr1.html"> Grupa I : Ciobneti, de paz, protecie i utilitari</a></p> <p><a href="gr2.html"> Grupa a II-a: De paz i protecie</a></p> </div> </div> <div class="news"> <img alt="Dog" src="images/templatemo_section_1_img_2.jpg"/> <div class="textarea"> <p><a href="gr3.html"> Grupa a III-a: Terrieri - cini de vizuin</a><a href="gr4.html"> Grupa a IV-a: Teckeli</a></p> <p><a href="gr5.html"> Grupa a V-a: Spitzi i tipuri primitive</a></p> </div> </div> </div> </div> <div class="templatemo_content_2"> <h1>Rase de caini</h1> <div class="contents style4"> <p>&nbsp; </p> <p>&nbsp;</p> <p class="style6"><a href="gr6.html">Grupa a VI-a: Gonitori pentru vnat mic, pentru hiuri</a></p> <p class="style5"> <span class="style6"><a href="gr7.html">Grupa a VII-a: Prepelicari, pontatori</a></span><span class="style6"><a href="gr8.html"><img src="images/templatemo_section_1_img_3.jpg" width="101" height="71" /></a></span></p> <p class="style5"> <span class="style6"><a href="gr8.html">Grupa a VIII-a: Cini de vntoare, pontatoriaportori, cini de ap</a></span></p> <p class="style5"> <span class="style6"><a href="gr9.html">Grupa a IX-a: nsotiori, de agrement</a></span></p> <p> <span class="style6"><a href="gr10.html">Grupa a X-a: Ogari (levrieri)</a></span></p> </div> </div> <div class="templatemo_gallery"> <div class="title"> <h1>Galerie foto</h1> </div> <div class="prev"> <img src="images/templatemo_head_menu.gif" alt="Previous" width="32" height="28" border="0" /> </div> <div class="images"> <a href="galerie_foto.html"><img src="images/templatemo_gallery_photo_1.jpg" alt="Gallery Image" border="0" /></a> <a href="galerie_foto.html"><img src="images/templatemo_gallery_photo_2.jpg" alt="Gallery Image" border="0" /></a> <a href="galerie_foto.html"><img src="images/templatemo_gallery_photo_3.jpg" alt="Gallery Image" border="0" /></a> <a href="galerie_foto.html"><img src="images/templatemo_gallery_photo_4.jpg" alt="Gallery Image"

border="0" /></a> <a href="galerie_foto.html"><img src="images/templatemo_gallery_photo_5.jpg" alt="Gallery Image" border="0" /></a> </div> <div class="next"> <img src="images/templatemo_head_menu.gif" alt="Previous" width="32" height="28" border="0" /> </div> </div> <div class="templatemo_validate"></div> <div class="clear">&nbsp;</div> </div> <div id="templatemo_footer_section"> <div class="templatemo_copyright"> Copyright 2012| Atestat HTML 2012</div> </div> </div> </body> <!-- This website template is designed by TemplateMo.com

-->

</html>

Programe utilizate: + Dreamwaver CS3 crearea paginilor, asezarea in pagina, link-uri,butoane, tabele, inserarea imaginilor etc ; + Fireworks CS3 editarea imaginilor ; + Microsoft FrontPage editarea textului.

Bibliografie: WWW.VIKIPEDIA.RO www.google.ro Diverse site-uri pt. animale de companie.

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