Sunteți pe pagina 1din 17

GESTIONAREA FIIERELOR CU AJUTORUL PROGRAMULUI EXPLORER Informaiile cu care lucrai sunt stocate pe calculatorul dumneavoastr n fiiere.

Programele pe care le folosii la rezolvarea lucrrilor i la crearea documentelor sunt, de asemenea, fiiere. Din aceast cauz, este important s tii cum s gestionai fiierele i cum s lucrai cu ele. Trebuie s tii cum s le denumii i s le salvai i cum s le organizai pe calculator, astfel nct s le putei localiza atunci cnd avei nevoie de ele. Windows Explorer este un program cuprins n sistemul Windows i care dispune de toate instrumentele necesare la gestionarrea fiierelor. 4 S nelegem fiierele i dosarele Sistemul de operare Windows organizeaz fiierele n dosare. Dac suntei familiarizat cu sistemul MS-DOS de organizare a fiierelor, un dosar este analogul unui director, iar un dosar dintr-un alt dosar este analog unui subdirector dintr-un director. Dac v place s le luai n consideraie ierarhic, putei continua vizualizarea organizrii fiierelor dumneavoastr, n acelai mod n care ai fcut-o n sistemul de operare DOS i n versiunile anterioare ale sistemului Windows. Singura diferen este faptul c n loc s avei directoare i subdirectoare, dispunei de dosare i de dosare n cadrul altora. i, aa cum vei constata n seciunea urmtoare, utiliznd Exploratorul putei trece n revist aranjarea ierarhic a dosarelor. 4Utilizarea programului Explorer pentru afiarea fiierelor i a dosarelor Windows conine un instrument nou, programul Windows Explorer, pe care l putei utiliza pentru a vedea cum sunt organizate fiierele i dosarele de pe calculatorul dumneavoastr. Putei trece n revist aranjarea ierarhic a dosarelor i putei privi n fiecare, pentru a vedea fiierele stocate n ele. De asemenea, putei utiliza Exploratorul la reorganizarea i gestionarea fiierelor i a dosarelor. Putei crea noi dosare; putei copia i muta fiierele dintr-un dosar n altul, pe un floppy disc sau pe un alt calculator (dac suntei ntr-o reea); putei redenumi i terge fiierele i dosarele; putei executa alte activiti de gestionare a fiierelor. Pentru a deschide Exploratorul, executai paii urmtori: Deschidei meniul Start i alegei Programs. Alegei Windows Explorer pentru a-i deschide fereastra (vezi Fig. 9) Observaie O dat ce ai deschis fereastra Exploratorului, o putei reduce la minim, n loc s o nchidei. Dup reducerea la minim a Exploratorului, l putei redeschide instantaneu executnd clic pe butonul su de pe bara de taskuri. Fig. 9 Fereastra Explorer este mprit n 2 panouri (ochiuri de fereastr . Panoul din stnga prezint o imagine ierarhizat a organizrii dosarelor de pe calculatorul dumneavoastr. n partea de sus a acestei structuri ierarhice se gsete pictograma Desktop (suprafaa de lucru). Imediat sub pictograma Desktop se gsete dosarul My Computer. Sub dosarul My Computer se gsesc nirate toate resursele calculatorului dumneavoastr. Acestea include unitile de floppy (reprezentate de pictograma unei uniti de floppy disc) i hard discurile locale (reprezentate de pictograma unei uniti de hard disc). n funcie de resursele calculatorului dumneavoastr, s-ar putea s vedei alte dosare afiate imediat sub dosarul My Computer. De exemplu, dac avei instalat pe calculator o unitate CDROM, l vei vedea pictograma sub dosarul My Computer. Panoul din dreapta al ferestrei Explorer afieaz coninutul oricrui dosar selectat n panoul din stnga. De exemplu, dac ai selectat unitatea local C:, de sub pictograma dosarului My Computer, vei vedea o list cu dosarele i fiierele existente pe hard disk. Pentru a prezenta coninutul hard discului, executai clic pe pictograma lui din panoul din stnga. Peentru a vedea coninutul unui dosar selectai-l n panoul din partea stng, iar coninutul su va fi prezentat n panoul din partea dreapt. Putei selecta un dosar executnd clic pe el cu mousul sau utiliznd tastele cu sgei direcionale ndreptate n sus i n jos. Putei extinde i restrnge imaginea ierarhic, pentru a afia mai multe sau mai puine detalii. Dac apare un semn plus (+) lng o pictograma din panoul din partea stng a ferestrei Exploratorului, nseamn c acel dosar conine dosare suplimentare. Pentru a le afia aceste

dosare, executai clic pe semnul plus (sau executai dublu clic pe dosar). Vor fi afiate toate dosarele cuprinse n el. Unele dintre acestea, la rndul lor, pot conine dosare, pe care le putei trrece n revist utiliznd aceeai modalitate. Pentru a ascunde dosarele dintr-un dosar, executai clic pe semnul minus (-) de lng acesta (sau executai dublu clic pe el). Restrngnd i extinznd dosarele afiate, putei trece n revist ct de multe sau ct de puine detalii dorii. 4Schimbarea modului de prezentare a fiierelor i a dosarelor Cnd vei utiliza prima oar Exploratorul, vei observa c dosarele i fiierele sunt reprezentate, n panoul din dreapta al ferestrei, de pictograme mari, ca n Fig. 9. De asemenea, putei afia fiierele i dosarele sub forma unor mici pictograme, a unei liste, sau cu detalii referitoare la fiiere. Pentru a schimba modul n care sunt afiate fiierele i dosarele, executai paii urmtori: Deschidei meniul View. Alegei una dintre urmtoarele comenzi: Comanda Rezultat Large Icons (pictograme mari) Small Icons (pictograme mici) Pictograme mari aranjate pe mai multe coloane Pictograme mici

List (list Pictograme mici ntr-o singur list Details (detalii) Dimensiunea, tipul i data modificrii 4Ordonarea fiierelor i a dosarelor n panoul din dreapta al Exploratorului putei ordona fiierele i dosarele dup nume, tip, dimensiune i dat. Pentru a sorta elementele afiate de Explorator, executai paii urmtori: Alegei View, Arrange Icons Selectai una dintre cele patru opiuni ale submeniului. Comand Rezultat by Name (dup nume) Ordoneaz dosarele i apoi fiierele dup numele lor by Type (dup tip) Ordoneaz dosarele i apoi fiierele dup tip (acesta poate s nu fie acelai cu extensia fiierului) by Size (dup dimensiune) Ordoneaz dosarele i apoi fiierele dup dimensiunea lor by Date (dup dat Ordoneaz dosarele i apoi fiierele dup data lor

Dac ai selectat opiunea Details pentru a afia dosarele i fiierele, putei ordona rapid lista articolelor dup nume, dimensiune, tip i data modificrii, executnd clic pe butonul din captul de sus al coloanei dup care vrei s facei ordonarea. De exemplu, executai clic pe Size pentru a ordona articolele listei dup dimensiune. 4Redenumirea fiierelor i a dosarelor Pentru a redenumi un fiier sau un dosar, executai paii urmtori: Executai clic pe numele (nu pe pictograma) dosarului sau al fiierului Executai clic pe butonul drept al mouse-ului i alegei comanda Rename Observai c numele este nconjurat de o caset i apare un punct de inserie plpitor. Observaie Dac n mod accidental ai executat dublu clic pe numele fiierului, se deschide fereastra programului care l-a creat. Pentru a reveni la operaia de schimbare a numelui,nchidei programul i executai din nou clic pe numele fiierului. Introducei de la tastatur noul nume i apsai tasta <Enter>. 4Gestionarea fiierelor i a dosarelor Cu Exploratorul putei face mai mult dect s afiai fiiere i dosare. Exploratorul este un

instrument esenial pentru gestionarea fiierelor i a dosarelor de pe calculatorul dumneavoastr. Il putei folosi la crearea noilor dosare, la mutarea lor dintr-o poziie n alta, la copierea i mutarea fiierelor dintr-un dosar n altul i de pe o unitate de disc pe alta. De asemenea, putei utiliza Exploratorul la tergerea i redenumirea fiierelor i a dosarelor. Exploratorul poate deveni secretara dumneavoastr, ajutndu-v s pstrai fiierele n ordine, astfel nct s putei utiliza mai eficient calculatorul. 4Selecia fiierelor i a dosarelor nainte s nvaai cum s gestionai fiierele i dosarele, trebuie s nvai s le selectai. Selecia unui singur fiier sau a unui dosar este o operaie uoar. Este suficient s executai clic pe acesta sau s utilizai tastele cu sgei direcionale ndreptate n sus i n jos de pe tastatur. Fiierul selectat este pus n eviden. De asemenea, putei selecta mai multe fiiere i dosare. Acest lucru este extrem de util atunci cnd dorii s copiai sau s mutai mai multe fiiere sau dosare o dat. De exemplu, putei selecta cteva fiiere i apoi le putei copia o dat pe un floppy disc, pentru a le face copii de siguran. Pentru a selecta mai multe fiiere cu ajutorul mouse-ului, executai clic pe primul fiier, meninei apsat tasta <Ctrl> i executai clic pe fiecare fiier suplimentar pe care vrei s-l selectai. Pentru a deselecta un fiier, continuai s inei apsat tasta <Ctrl > i executai nc o dat clic pe fiier. Pentru a selecta rapid un grup continuu de fiiere, selectai primul fiier din grup, meninei apsat tasta <Shift> i selectai ultimul fiier din grup. Toate fiierele cuprinse ntre primul i ultimul vor fi, de asemenea, selectate. O alt modalitate de a selecta un grup continuu de fiiere este tragerea, cu ajutorul mousului, a unei casete n jurul grupului de fiiere. 4Crearea dosarelor noi Pentru a organiza fiierele de pe calculatorul dumneavoastr, putei crea ct de multe dosare dorii. Pe msur ce creai tot mai multe fiiere cu programele de pe calculator, probabil c vei dori s dezvoltai un sistem de organizare care s v ajute s pstrai evidena acestora, aa cum ai face cu hrtiile de la birou. Cu ct creai mai multe fiiere, cu att mai mult s-ar putea s fie necesar organizarea lor n categorii, pentru a le face mai uor de localizat. Dosarele sunt cheia organizrii fiierelor dumneavoastr. De exemplu, putei ncepe cu un dosar n care pstrai toate scrisorile de afaceri. n timp, dosarul se va umple cu att de multe fiiere nct va deveni dificil gsirea unuia. n acest moment, are sens mprirea acestor fiiere n categorii de exemplu dup clieni sau dup firm i crearea unui dosar pentru fiecare categorie. Putei utiliza Exploratorul la crearea acestor noi dosare. Pentru a crea un dosar nou, executai paii urmtorii: n panoul din stnga Exploratorului, selectai dosarul n care vrei s creai noul dosar. 2. Alegei File, New (nou), Folder (dosar). n panoul din dreapta al Exploratorului, va aprea un nou dosar, pregtit pentru a-i da un nume. Introducei de la tastatur numele dosarului i apsai tasta <Enter>. Dosarele, ca i fiierele, pot avea nume lungi. Numele dosarelor pot conine cel mult 255 de caractere i pot include spaii. Nu pot fi utilizate urmtoarele caractere: \ ? : < > |

4Mutarea i copierea fiierelor i a dosarelor O sarcin important a activitii de gestionare a fiierelor de pe calculatorul dumneavoastr este mutarea i copierea fiierelor i a dosarelor. n cazul n care creai noi dosare pentru a mpri n subcategorii fiierele dintr-un dosar, trebuie s mutai fiecare fiier din dosarul iniial, n cel nou. Putei s mutai un dosare ntreg n altul. Sau putei s copiai fiiere de pe hard disc pe un floppy disc, pentru a le face cpii de siguran sau pentru a le transfera pe un alt calculator. Utiliznd Exploratorul i mouse-ul putei muta i copia rapid fiiere i dosare, fr s atingei tastatura.

Exist posibilitatea de a utiliza dou metode pentru a copia i muta fiiere i dosare: fie comenzile Cut (decupeaz sau Copy (copiaz fie mouse- ul pentru a trage i a le fixa. prezente n meniu,

Pentru a muta sau copia fiiere utiliznd meniul, executai paii urmtori: n panoul din dreapta al Exploratorului, selectai fiierele sau dosarele pe care vrei s le mutai. Pentru a muta elementele, alegei Edit, Cut; executai clic cu butonul drept al mouse-ului pe articolele selectate, pentru a afia meniul rapid, i apoi executai clic pe Cut; sau executai clic pe butonul Cut de pe bara cu instrumente; sau apsai tastele <Ctrl> + <X >. Sau Pentru a copia elementele, alegei Edit, Copy; executai clic cu butonul drept al mousului pe articolele selectate, pentru a afia meniul rapid, i apoi executai clic pe Copy; sau executai clic pe butonul Paste de pe bara cu instrumente; sau apsai tastele <Ctrl> + <C>. n panoul din stnga al ferestrei Exploratorului, selectai, cu butonul drept al mouse-ului, dosarul care va conine elementele copiate sau mutate i alegei Paste (lipete); sau executai clic pe butonul Paste de pe bara cu instrumente; sau apsai tastele <Ctrl> +<V> . Pentru a muta sau copia fiierele utiliznd metoda tragerii i a fixrii (drag-and-drop), executai paii urmtori: n panoul din dreapta al Exploratorului, selectai fiierele sau dosarele pe care vrei s le mutai. Dac n panoul din stnga al Exploratorului dosarul n care vrei s mutai elementele selectate nu este vizibil, utilizai bara de derulare pentru a-l aduce n imagine. Dac este nevoie s expunei un subdosar, executai clic pe semnul + de lng dosarul care l conine. Pentru a muta elementele selectate, tragei-le n noul dosar din panoul stng al Exploratorului. Sau Pentru a copia elementele selectate, meninei apsat tasta <Ctrl> i tragei-le n noul dosar din panoul stng al Exploratorului. Cnd meninei apsat tasta <Ctrl>, la indicatorului mouse-ului apare un semn plus (+), indicnd aciunea de copiere a fiierelor. nainte de eliberarea butonului mouse-ului, asigurai-v c este pus n eviden dosarul corect. 4Copierea discurilor Uneori, putei dori s realizai o copie identic a ntregului floppy disc. Acest lucru este uor de fcut fie n cadrul Exploratorului, fie n fereastra My Computer. Putei copia de pe un floppy disc pe altul, utiliznd aceeai unitate, dar discurile trebuie s aib aceeai capacitate de stocare. Discul pe care copiai va fi ters n timpul acestei operaii. Pentru a copia un disc, executai paii urmtori: Introducei floppy discul pe care vrei s-l copiai. Executai clic cu butonul drept al mouse-ului pe discul din fereastra My Computer sau pe cel din panoul din stnga al ferestrei Exploratorului. Alegei din meniul rapid Copy Disk (copiaz discul). Rezultatul va fi deschiderea casetei de dialog Copy Disk . Dac avei numai o unitate de disc de aceast dimensiune, ea va fi pus n eviden att n zona Copy From (copiaz de pe), ct i n zona Copy To (copiaz pe) a casetei de dialog. Dac avei o alt unitate de aceeai dimensiune, ea va fi prezentat n list i o putei selecta pentru a realiza copierea de pe o unitate pe alta. 4. Alegei Start (ncepe). 5. Dac utilizai aceeai unitate att pentru surs, ct i pentru destinaie (copia), vei fi ntiinati s schimbai floppy discurile atunci cnd este necesar. 6. Cnd dicul a fost copiat, putei copia un altul alegnd Start sau putei ncheia alegnd Close. 4tergerea fiierelor i a dosarelor. Inevitabil, va sosi momentul n care vei dori s tergei un fiier sau un dosar. Cauzele pot fi diverse: nu mai avei nevoie de fiier sau ai creat cteva dosare noi pentru a mpri n categorii fiierele dintr-un dosar existent, sau vrei s tergei dosarul iniial dup ce ai mutat fiierele n alte poziii. tergerea fiierelor i a dosarelor este o parte esenial a aciunii de evitare a ncrcrii excesive i inutile a calculatorului dumneavoastr. Trebuie s tergei cu atenie fiierele i dosarele, astfel nct s nu tergei din greal, unul de care nc avei nevoie. Din fericire, Windows conine acum un dosar denumit Recyle Bin (lada de deeuri), n care sunt stocate temporar fiierele terse, pn cnd l golii. Putei recupera fiire din dosarul Recycle Bin, dac v rzgndii sau dac le tergei din greal.

Pentru a terge un fiier sau un dosar, executai paii urmtori: Selectai fiierul sau dosarul pe care vrei s-l tergei. Putei selecta mai multe fiiere sau dosare utiliznd metodele descrise n seciunea Selecia fiierelor i a dosarelor, prezentat mai devreme n acest capitol. Executai clic cu butonul drept al mouse-ului pe selecie i apoi clic pe Delete (terge). Alegei File, Delete (sau apsai tasta <Delete>, sau executai clic pe butonul Delete de pe bara cu instrumente). Executai clic pe Yes la apariia casetei de dialog Confirm Delete (confirm tergerea fiierului), sau executai clic pe No dac dorii s abandonai stergerea fiierului. Dac tergei mai multe fiiere, Exploratorul afieaz caseta de dialog Confirm Multiple File Delete (confirm tergerea mai multor fiiere).

Cnd tergei unele fiiere, putei vedea un mesaj care v avertizeaz c fiierul este de tip sistem, ascuns sau numai pentru citire. Fiierele sistem sunt necesare pentru ca Windows s lucreze corect i nu trebuie terse. Fiierele ascunse i cele care nu pot fi dect citite pot fi necesare anumitor programe pentru a lucra corect, sau pot fi doar fiiere pe care le-ai protejat cu aceste atribute, mpiedicnd tergerea lor accidental. nainte de a terge oricare dintre aceste tipuri de fiiere, va trebui s fii convins c sistemul nu are nevoie de ele pentru a lucra corect. 4Refacerea fiierelor terse Fiierele terse sunt mutate ntr-un dosar denumit Recycle Bin (lada de deeuri). Putei deschide acest dosar la fel cum ai face-o n cazul altuia, putei selecta un fiier i l putei reface n poziia iniial. De asemenea, putei muta sau copia fiiere din dosarul Reycle Bin ntr-o alt poziie, n acelai mod n care ai nvat s mutai i s copiai fiiere din alte dosare. Dosarul Reycle Bin v d sigurana c mai avei o ans dac ai ters din greal un fiier sau un dosar. Pentru a reface un fiier sau un dosar ters, executai paii urmtori: Executai dublu clic pe pictograma Reycle Bin de pe suprafaa de lucru pentru a deschide fereastra Reycle Bin. Selectai fiierul sau fiierele pe care vrei s le refacei. Pentru selecia mai multor fiiere, putei utiliza modalitile descrise n seciunea Selecia fiierelor i a dosarelor. Executai clic cu butonul drept al mouse-ului pe fiierele selectate i apoi clic pe Restore (restabilete), sau alegei File, Restore. Fiierele sunt refcute n dosarele din care au fost terse. Dac dosarul iniial n care a existat un fiier a fost ters, el este la rndul lui refcut. De asemenea, putei reface un fiier ntr-alt dosar dect cel din care a fost ters. Cea mai uoar modalitate de a realiza acest lucru este utilizarea Exploratorului. Deschidei dosarul Reycle Bin n fereastra Exploratorului, selectai fiierele pe care vrei s le refacei i folosii una dintre metodele prezentate anterior n acest capitol.

LECTIA 1 LECTIA 1 !!! Deschide un Notepad (NEW ,Text Document) si incepe cu acestea ... <HTML> </HTML>

Fiecare dintre acestea sunt numite tag-uri. Exista un tag pentru inceput si un tag pentru final(incheiere). Pentru a face un tag final doar adauga / la tagul de inceput. Majoritatea, dar nu toate tagurile au un tag final. Ganditi-va la tag-uri ca si cum ati vorbi cu browserul, sau mai bine ca si cum i-ati da instructiuni. Ceea ce tocmai i-ati spus pana acum browserului (mai mult sau mai putin) : acesta este inceputul unui document HTML (<HTML> unui document HTML (</HTML> sfarsit. si acesta este sfarsitul . Acum trebuie sa punem ceva intre tag-urile de inceput si de

----------------------------------------------------------------------Fiecare document HTML are nevoie de o pereche de tag-uri de tip : HEAD. <HTML> <HEAD> </HEAD> </HTML> ----------------------------------------------------------------------Fiecare pereche de tag-uri de tip HEAD are nevoie de o pereche de tag-uri de tip TITLE ( reprezinta titlu sub care va aparea pagina denumita). <HTML> <HEAD> <TITLE></TITLE> </HEAD> </HTML> ----------------------------------------------------------------------La fel ca si tag-urile de tip HEAD fiecare document HTML are nevoie de o pereche de tag-uri de tip BODY ( textul in pagina sub forma de titlu). <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY> </BODY> </HTML> ----------------------------------------------------------------------Dati-i documentului dumneavoastra un titlu si puneti ceva in body. <HTML> <HEAD> <TITLE>My big ole bad page!</TITLE> </HEAD> <BODY> Salut Bojo! </BODY> </HTML> Acum salveaza-l, nu ca si un fisier text, ci ca si un fisier html. Salveaza-l ca si pagina1.html intrun director nou undeva. Daca esti putin derutat cum sa faci asta atunci urmeaza instructiunile... In Notepad-ul tau click File apoi Save As. Denumeste-l cum vrei. Apoi dublu click pe el pentru a-l deschide. Unde scrie File name scrie: page1.html Unde scrie Save as type: fii sigur ca scrie All Files(*.*).

Felicitari! Esti parintele fericit al unei pagini de web! Poti sa-i faci upload pe un server si toata lumea poate sa-ti vada creatia! Pentru a vedea ceea ce ai realizat pana acum deschide un browser de web, apoi in browserul pe care tocmai l-ai deschis click File / Open / Browse, selecteaza fisierul page1.html din noul director creat. In continuare ne propunem sa dezvoltam aceasta pagina elementara. Dupa fiecare modificare pe care o vei face nu uita sa salvezi, pentru ca altfel nu vei observa schimbarile. Dupa ce ai salvat intra in browserul de web si click Refresh. Inca doua lucruri inainte sa trecem la lectia a doua. 1) Ceea ce ai realizat se numeste scheletul unui document HTML; orice document HTML are nevoie de aceste tag-uri de baza. 2) Ceea ce ai scris intre tag-urile <TITLE>...</TITLE> va aparea in extremitatea de sus a ferestrei browserului. ** FAQ: Ce este Notepad si unde il gasesc? A: Notepad este un text editor pentru Windows. Pe majoritatea sistemelor Win9X : click Start button si alege Programs apoi Accessories. Trebuie sa arate ca un mic carnetel albastru. Poti merge la un site shareware/freeware si-ti poti alege un text editor, majoritatea fiind gratuite. "For the time being though, Notepad will do quite nicely."

LECTIA 2 LECTIA 2 !!! Pentru a simplifica lucrurile in continuare voi scrie doar ceea ce se gaseste intre tagurile de tip <BODY>. Voi omite tagurile de tip <HTML>, <HEAD> & <TITLE>. Lesne de inteles ca trebuie sa le tineti in documentul dumneavoastra si in continuare. <BODY> </BODY> Deschideti documentul salvat ca pagina htm, accesati butonul EDIT din meniul si Edit with Notepad. Se mai poate accesa si din meniu View - Source Acum scrieti: Ceva foarte frumos. <BODY> Ceva foarte frumos. </BODY>

Ceva foarte frumos. De fiecare data cand faceti o schimbare in documentul dumneavoastra salvati-l, apoi apasati butonul Refresh in browser. In unele cazuri doar apasand Refresh nu se intampla nimic... in acest caz apasati Refresh in timp ce tineti apasata tasta Shift. M-am gandit ca primul lucru pe care al trebui sa-l invatam este cum sa schimbam culoarea background-ului. <BODY BGCOLOR="#CCFFCC"> Ceva foarte frumos. </BODY> Ceva foarte frumos. CCFFCC este culoarea verde. Aveti o lista de culori. Poti sa folosesti o poza pentru BACKGROUND. (Tine minte!: poza trebuie sa fie in acelasi director cu fisierul HTML.) <BODY BACKGROUND="chef.gif"> Ceva foarte frumos. </BODY>

Aici este poza :

Pentru ca poza sa apara browserul trebuie sa o poata detecta(gasi). In momentul de fata dorim ca poza sa fie in acelasi director cu fisierul HTML (pagina1.html). Cel mai simplu mod de a face asta: da click de dreapta pe poza chef.gif apoi alege Save Image As. Salveaz-o in directorul unde se afla pagina1.html . Mai tarziu vom intra si in mai multe detalii. Este evident ca imaginea apare de mai multe ori. Daca folosesti o imagine "lunga" poti obtine un efect ca si acesta... <BODY BACKGROUND="bluebar.gif"> Something really cool </BODY>

Aici este poza din background (Este de fapt 1700x4, dar am comprimat-o aici la 560x4 ca sa poata fi vazuta cu orice rezolutie) FAQ: Am vazut pagini unde background-ul este fixat si pagina se deruleaza peste el. Cum pot sa fac asta? A: Simplu... adauga BGPROPERTIES=FIXED la tag-ul BODY ... <BODY BACKGROUND="background-ulmeu.gif" BGPROPERTIES=FIXED> Tine minte ca aceasta comanda este specifica pentru Internet Explorer. Doar cei ce folosesc Internet Explorer sau un browser bazat pe IE vor putea vedea aceasta.

LECTIA 3 LECTIA 3 !!! Sa ne intoarcem de unde am pornit. <BODY> Ceva foarte frumos. </BODY>

Ceva foarte frumos. Putem face lucrurile bold. <BODY> Ceva foarte <B>frumos.</B> </BODY>

Ceva foarte frumos. Ceea ce ii spunem browser-ului (mai mult sau mai putin) este: de la <B> incepe sa faci lucrurile bold, pana la</B>. (de aici nu mai face lucrurile bold) Acelasi principiu se aplica si pentru italics... <BODY> Ceva <I>foarte</I> <B>frumos.</B> </BODY>

Ceva foarte frumos. ...si pentru underline. <BODY> <U>Ceva</U> <I>foarte</I> <B>frumos.</B> </BODY>

Ceva foarte frumos. Ne intoarcem la formula initiala. <BODY> Ceva foarte frumos </BODY>

Ceva foarte frumos. Putem sa combinam aceste tag-uri. <BODY> Ceva foarte <I><B>frumos.</B></I> </BODY>

Ceva foarte frumos. Sunt sigur ca veti folosi tag-urile combinate. Pentru a evita confuzia browser-ului acestea trebuie sa fie concentrice nu plane.Dar mai bine sa ilustrez..: <TAG1><TAG2></TAG1></TAG2> Tag-uri plane.... gresit <TAG1S><TAG2></TAG2></TAG1> Tag-uri concentrice.... bine

LECTIA 4 LECTIA 4 !!! Un tip de text foarte folositor este Typewriter Text. <BODY> <TT>Ceva foarte frumos.</TT> </BODY> Ceva foarte frumos. Fiecare litera foloseste aceeasi distanta pe orizontala... Acesta este un text normal -> iiiiiiiiii oooooooooo mmmmmmmmmm Aici se foloseste Typewriter Text -> iiiiiiiiii oooooooooo mmmmmmmmmm Putem modifica font size (marimea caracterelor)... Este foarte usor! Prima data adauga tagurile de tip <FONT> ... <BODY> Ceva foarte <FONT>frumos.</FONT> </BODY> Apoi specifica marimea: SIZE. <BODY> Ceva foarte <FONT SIZE=6>frumos.</FONT> </BODY> Ceva foarte frumos.

Caracterele pot avea 7 marimi diferite: foarte mic mic normal mediu mare foarte mare & imens! 1 2 3 4 5 6 7 Doua lucruri vreau sa discutam acum. Primul, un <TAG> ii spune browser-ului sa faca ceva. Un ATTRIBUTE merge in interiorul <TAG>-ului si ii spune browser cum sa o faca. AL doilea lucru este despre marimile standard, automate (defaults). Asa cum probabil stiti, valoarea standard (default value) este o valoare pe care browser-ul o ia daca nu i-ati specificato anterior. un bun exemplu este marimea caracterelor (font size). Valoarea standard (default) pentru marimea caracterelor (font size) este 3 (de obicei). Daca nu specificati nimic va fi 3 chiar daca modificati felul caracterelor (face). Fiecare browser are o marime default setata - face, name, size and color. Valoarea default pt. face este probabil Times New Roman 12pt si culoarea default este negru. Bineinteles putem modifica valorile default. Un mic exemplu ARIAL si COMIC SANS. <BODY> Ceva foarte <FONT FACE="ARIAL">frumos.</FONT> </BODY> Ceva foarte frumos. Daca persoana care se uita la pagina dumneavoastra nu are specificat in calculator font-urile pe care le-ati folosit, atunci ei vor vedea font-urile default. Asa ca fiti precauti in folosirea fonturilor. Arial and Comic Sans MS sunt de obicei distribuite cu Windows. Asa ca specificati mai multe font-uri. (Da! Puteti face asta!). Doar faceti asa ceva... <FONT FACE="ARIAL, HELVETICA, LUCIDA SANS">Se poate foarte simplu</FONT>. Acum sa explicam ce se intampla- Browser-ul cauta ARIAL. Daca il gaseste atunci il foloseste. Daca nu, merge mai departe la HELVETICA. Daca nu il poate gasi nici pe acesta atunci cauta LUCIDA SANS. Si daca nu-l poate gasi atunci foloseste font-ul default. Care sunt font-urile care se folosesc de obicei? Andale Mono Arial Arial Black Comic Sans MS Courier New Georgia Impact Times Rew Roman Trebuchet MS Verdana Ca sa vedeti ce varietate de font-uri exista atunci incercati lectia 5.Acolo veti gasi un program in limba engleza. Varianta in limba romana este disponibila pentru membrii, acestia ii pot face chiar si download. Mai multe informatii despre cum poti deveni membru gasesti la sectiunea membrii .

LECTIA 5 LECTIA 5 !!! Acum cred ca este momentul potrivit sa vorbim putin despre sintaxe. De fiecare data cand aveti o sintaxa de genul ATRIBUT="valoare", valoarea trebuie neaparat sa fie intre gilimele. Este foarte important. Nici macar nu aveti idee de cate ori am facut o pagin si am patit-o ca nu era ceva bine din cauza unei mici scapari: o gilimea sau un spatiu sau un semn de genu' >. Intr-o buna zi ne vom separa de acest gen de coduri, dar pentru moment trebuie sa fim precauti. Altceva este, cum cred ca ati observat deja, ca eu folosesc LITERE MARI pentru majoritatea tag-urilor. Este doar o prejerinta personala. Eu cred ca tag-urile ies in evidenta mai bine daca folosesc litere mari. Puteti folosi <font> in loc de <FONT>. Puteti chiar folosi <fOnT> daca acestea vi s-au strecurat printre degete. HTML este 100% case INsensitive. OK! inapoi la lucru'... Puteti modifica culoarea fontului daca doriti. (font color) <BODY> Ceva foarte <FONT COLOR="#FF0000">frumos.</FONT> </BODY> Ceva foarte frumos. Putem folosi mai multe ATRIBUTE intr-un <FONT> tag... <BODY> Ceva foarte <FONT COLOR="#FF0000" FACE="ARIAL" SIZE="7">frumos</FONT> </BODY>

Ceva foarte frumos Oh da, incepem sa o punem pe roate.. <BODY BGCOLOR="#FFFFFF"> Ceva foarte <U><I><B><FONT COLOR="#FF0000" FACE="ARIAL" SIZE="7">frumos</FONT></B></I></U> </BODY> Ceva foarte frumos. Simpt nevoia sa mai subliniez inca o data ca tagurile trebuie sa fie concentrice. <TAG3><TAG2><TAG1>Hooha!</TAG1></TAG2></TAG3> Nu conteaza ce tag este primul. Daca vrei sa faci ceva rosu si bold nu trebuie sa faci una sau alta prima data. poti sa le faci in orice ordine doresti. Ca si aici... <TAG2><TAG1><TAG3>Hooha!</TAG3></TAG1></TAG2> Cel mai frecvent se greseste asa, dar este foarte clar ca nu se va realiza nimic. <TAG3><TAG2><TAG1>Hooha!</TAG3></TAG1></TAG2> (Nu am gasit o alta cale de a explica, asa ca metoda cu exemplele sper ca este de ajutor.)

LECTIA 6 LECTIA 6 !!! Alt tag care merita precizat este section heading. Se folosesc intre valorile 1-6. Fiecare valoare reprezinta o marime a caracterelor. <H1>Ceva foarte frumos.<H1> <H2>Ceva foarte frumos.<H2> <H3>Ceva foarte frumos.<H3> <H4>Ceva foarte frumos.<H4> <H5>Ceva foarte frumos.<H5> <H6>Ceva foarte frumos.<H6>

Ceva Ceva Ceva Ceva Ceva Ceva

foarte foarte foarte foarte foarte foarte

frumos. frumos. frumos. frumos. frumos. frumos.

Un atribut folositor al headingurilor este ALINIEREA observati singuri : <H2 ALIGN="left">Ceva foarte frumos.<H2> <H2 ALIGN="center">Ceva foarte frumos.<H2> <H2 ALIGN="right">Ceva foarte frumos.<H2> Ceva foarte frumos. Ceva foarte frumos. Ceva foarte frumos. Inca un singur lucru si am terminat aceasta lectie. Browser-ul are setari default pentru culoarea textului, culoarea link-urilor, culoarea link-urilor active, culoarea link-urilor vizitate si aditional pentru culoarea background-ului. Defaults : Textul este de obicei negru Link-urile sunt de obicei albastre Link-urile active sunt de obicei rosii Link-urile vizitate sunt de obicei violete

Poti sa schimbi culorile daca este nevoie. Subliniez daca este nevoie. Lumea intreaga este obisnuita sa vada link-urile albastre. De ce vrei sa ne induci in eroare? Poti schimba valorile default pentru intregul document din tag-ul <BODY>. <BODY BGCOLOR="#00000" TEXT="#FFFF66" LINK="#00FF66" VLINK="#00BB33" ALINK="#00CCFF"> Ceva foarte frumos. </BODY> Ceva foarte frumos. Stiu ca inca nu am invatat cum se fac link-urile, dar invatam cum se schimba culorile lor, ceea ce ne va fi de folos cand vom ajunge la link-uri. Acum background-ul este negru si textul este galben. Link-urile sunt verde-neon Link-urile vizitate sunt verde-inchis Link-urile active sunt albastru ceruleum Am scris putin HTML & JavaScript si am realizat Color Picker (Tabela de culori)

ceea ce face mai usor de experimentat alegerea culorilor intr-un fisier HTML. Cu acesta poti deasemenea alege diferite fonturi, background-uri si multe altele. Tag-ul <BODY> este generat automat pentru tine. Incearca-l pentru ca nu ai nimic de pierdut. Acum poti face Litere mari si rosii sau litere mici si ingrosate. Poti folosi alte Font-uri sau monospaced(=TT). Poti face chiar si un rollercoaster! Inainte ca aceasta lectie sa se raceasca inca un lucru. Poti vedea codul HTML al oricarei pagini doresti alegand View/Source (Document Source) in browser-ul tau. Asa ca daca vezi o pagina si te intrebi, Cum a facut asta? raspunsul este la doar cateva clickuri inainte. LECTIA 7 LECTIA 7 !!! Cred ca vom incepe invatand ceva despre cum lucreaza browser-ul. Pentru inceput un exemplu... <BODY> Ceva foarte frumos ca si un cub de gheata. </BODY> Ceva foarte frumos ca si un cub de gheata. <BODY> Hei! Ce se intampla aici.?? </BODY> Hei! Ce se intampla aici.??

Browser-ul nu recunoaste formatul in care ati scris. Pana ce nu i se specificait el afiseaza caracterele liniar. Daca vreti sa incepeti o linie noua trebuie sa folositi break. <BODY> Hei! <BR>Ce <BR>se <BR>intampla <BR>aici.?? </BODY> Hei! Ce se intampla aici.?? <BR> spune browser-ului - incepe o linie noua. Se poate folosi tag-ul <BR> si pentru a sari peste o linie, pentru a lasa un spatiu de un rand sau mai multe randuri. <BODY> <BR>Ce <BR>se <BR> <BR>intampla <BR> <BR>aici.?? </BODY>

Ce se intampla aici.?? Sau un spatiu de mai multe randuri. <BODY> <BR>Ce <BR>se <BR> <BR>intampla <BR> <BR> <BR> <BR> <BR> <BR> <BR> <BR>aici.?? </BODY>

Ce se intampla

aici.??

LECTIA 8 LECTIA 8 !!! Sa ne intoarcem la pagina initiala. <BODY> Ceva foarte frumos. </BODY>

Ceva foarte frumos. Acesta este tag-ul paragraph. Ganditi-va la paragraph ca si la o portiune aparte de text. <BODY> <P>Ceva foarte frumos.</P> </BODY>

Ceva foarte frumos. De unul singur nu face multe. Totusi pentru majoritatea browser-urilor creaza efectul de a lasa o linie libera. <BODY> <P>Ceva foarte frumos</P> <P>ca si un cub de gheata.</P> </BODY>

Ceva foarte frumos ca si un cub de gheata. Pentru ce altceva este bun tag-ul <P> ? Ei bine, este bun pentru alinierea lucrurilor. <BODY> <P ALIGN="left">Ceva foarte frumos</P> <P ALIGN="center">ca si un cub de gheata</P> <P ALIGN="right">sau o portocala.</P> <P ALIGN="left"> Ceva foarte frumos <BR>ca si un cub de gheata <BR>sau o portocala. </P> <P ALIGN="center"> Ceva foarte frumos <BR>ca si un cub de gheata <BR>sau o portocala. </P> <P ALIGN="rihgt"> Ceva foarte frumos <BR>ca si un cub de gheata <BR>sau o portocala. </P> </BODY> Ceva foarte frumos ca si un cub de gheata sau o portocala. Ceva foarte frumos ca si un cub de gheata

sau o portocala. Ceva foarte frumos ca si un cub de gheata sau o portocala. Ceva foarte frumos ca si un cub de gheata sau o portocala. Ceva despre tag-ul <P> ... in exemplele de mai sus am folosit si tag-ul de sfarsit (</P> , nu este neaparat nevoie. Browser-ul intelege cand un nou <P>aragraph incepe si atunci pe ultimul il inchide automat . Asa ca... <P>Ceva <P>Inca ceva Este la fel cu... <P>Ceva</P> <P>Inca ceva</P> Inca ceva inainte sa continuam, mai devreme am vorbit despre centrarea lucrurilor. Mai exista un mod de a centra lucrurile pe care ar trebui sa-l stiti. Este foarte simplu de explicat. Se poate centra un cuvant sau toata pagina. Tot ce se gaseste intre tag-urile <CENTER> se centreaza automat. <BODY> <CENTER>Ceva foarte frumos.</CENTER> </BODY>

Ceva foarte frumos.

LECTIA 9 LECTIA 9 !!! Uita-te aici... <BODY> Ceva foarte </BODY> Ceva foarte frumos Browser-ul nu va recunoaste mai mult de 1 spatiu. La prima vedere pare stupid, dar acest lucru iti da control absolut asupra documentelor. Aici este un mic cod care inseamna "spatiu" pentru browser -> &nbsp; Incearca asta... <BODY> Ceva&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; foarte&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; frumos </BODY> Ceva foarte frumos Caracterul & inseamna inceputul unui caracter specia si caracterul ; inseamna sfarsitul unui caracter special. Caracterele dintre ele reprezinta abreviere pentru caracterul special. Aici sunt cateva caractere speciale - cele mai folosite - si ceea ce inseamna fiecare. &nbsp; non-breaking space &lt; < less-than symbol &gt; > greater-than symbol &amp; & ampersand &quot; " quotation mark &shy; soft hyphen Nu trebuie sa le folositi tot timpul, doar atunci cand scrieti un caracter si browser-ul se incurca. De unde stiu cand acest lucru se intampla? Totul vine de la sine dupa putin antrenament.

frumos

Mai jos veti vedea o lista de caractere speciale. Probabil nu le veti folosi niciodata, dar vreau sa stiti ca ele exista. Sa repetam: browser-ul va tipari textul pe care l-ati scris numai daca-i spuneti cum..break, etc. El va reduce orice loc gol la 1 spatiu. Daca vreti mai multe spatii trebuie sa introduceti codul special pentru spatiu (&nbsp . Daca apasati ENTER in timp ce scrieti browser-ul se va comporta ca si cum ati lasa un spatiu, daca deja nu ati lasat unul. Inca un mic exemplu. <BODY> Ceva<BR>foarte<BR>frumos<BR> ca si<BR>un cub<BR>de gheata! </BODY>

Ceva foarte frumos ca si un cub de gheata! Cred ca am fost destul de clar! Aceasta este o lista de caractere speciale pe care e foarte posibil sa nu le folositi niciodata, dar totusi es bine sa le cunoasteti: &Agrave; capital A, grave accent &iuml; small i, diresis/umlaut &agrave; small a, grave accent &ETH; capital Eth, Icelandic &Aacute; capital A, acute accent &eth; small eth, Icelandic &aacute; small a, acute accent &Ntilde; capital N, tilde &Acirc; capital A, circumflex &ntilde; small n, tilde &acirc; small a, circumflex &Ograve; capital O, grave accent &Atilde; capital A, tilde &ograve; small o, grave accent &atilde; small a, tilde &Oacute; capital O, acute accent &Auml; capital A, diresis/umlaut &oacute; small o, acute accent &auml; small a, diresis/umlaut &Ocirc; capital O, circumflex &Aring; capital A, ring &ocirc; small o, circumflex &aring; small a, ring &Otilde; capital O, tilde &AElig; capital AE ligature &otilde; small o, tilde &aelig; small ae ligature &Ouml; capital O, diresis/umlaut &Ccedil; capital C, cedilla &ouml; small o, diresis/umlaut &ccedil; small c, cedilla &Oslash; capital O, slash &Egrave; capital E, grave accent &oslash; small o, slash &egrave; small e, grave accent &Ugrave; capital U, grave accent &Eacute; capital E, acute accent &ugrave; small u, grave accent &eacute; small e, acute accent &Uacute; capital U, acute accent &Ecirc; capital E, circumflex &uacute; small u, acute accent &ecirc; small e, circumflex &Ucirc; capital U, circumflex &Euml; capital E, diresis/umlaut &ucirc; small u, circumflex &euml; small e, diresis/umlaut &Uuml; capital U, diresis/umlaut &Igrave; capital I, grave accent &uuml; small u, diresis/umlaut &igrave; small i, grave accent &Yacute; capital Y, acute accent &Iacute; capital I, acute accent &yacute; small y, acute accent &iacute; small i, acute accent &THORN; capital Thorn, Icelandic &Icirc; capital I, circumflex &thorn; small thorn, Icelandic &icirc; small i, circumflex &szlig; small sharp s, German sz &Iuml; capital I, diresis/umlaut &yuml; small y, diresis/umlaut

Mai multe caractere de la ISO 8859-1 &nbsp; non-breaking space &plusmn; plus-or-minus sign &iexcl; inverted exclamation mark &sup2; superscript two &cent; cent sign &sup3; superscript three &pound; pound sign &acute; acute accent &curren; general currency sign &micro; micro sign &yen; yen sign &para; pilcrow (paragraph sign)

&brvbar; broken (vertical) bar &middot; middle dot &sect; section sign &cedil; cedilla &uml; umlaut/dieresis &sup1; superscript one &copy; copyright sign &ordm; ordinal indicator, male &ordf; ordinal indicator, fem &raquo; angle quotation mark, right &laquo; angle quotation mark, left &frac14; fraction one-quarter &not; not sign &frac12; fraction one-half &shy; soft hyphen &frac34; fraction three-quarters &reg; registered sign &iquest; inverted question mark &macr; macron &times; multiply sign &deg; degree sign &div; division sign

LECTIA 10 LECTIA 10 !!! Sa incepem sa punem imagini(poze) in pagina de web. O vom folosi pe aceasta. Inca o data click de dreapta pe ea si salveaz-o in acelasi director(momentan) cu fisierul HTML cu care lucrezi. Se specifica existenta unei imagini intr-un fisier cu tag-ul <IMG> (image). <BODY> <IMG> </BODY> Trebuie sa specificati sursa si marimea. <BODY> <IMG SRC="chef.gif" WIDTH=130 HEIGHT=101> </BODY>

FAQ: Cum gasesc WIDTH si HEIGHT pentru o imagine? A: Sunt mai multe metode. O metoda este sa o incarci intr-un program de grafica. Unul din aceste programe gratuite este Irfan View. Alta metoda este sa folosesti un text sau html editor care iti da automat marimea imaginii cand o introduci. Unul ar fi Note Tab. Il gasesti la adresa www.notetab.com Sursa SRC nu specifica numai ce imagine se foloseste ci specifica si unde este imaginea, in ce director. Sursa folosita, "chef.gif", inseamna ca browserul va cauta imaginea numita chef.gif in acelasi director unde se gaseste si documentul html. Mai jos sunt niste diagrame. SRC="chef.gif" inseamna ca imaginea se gaseste in acelasi director cu documentul html. SRC="images/chef.gif" inseamna ca imaginea se gaseste intr-un director mai jos cu un nivel decat documentul html. SRC="../chef.gif" inseamna ca imaginea se gaseste intr-un director mai sus cu un nivel decat documentul html. SRC="../../chef.gif" inseamna ca imaginea se gaseste intr-un director mai sus cu doua nivele decat documentul html. SRC="../images/chef.gif" inseamna ca imaginea se gaseste intr-un director mai sus cu un nivel si apoi intr-un director cu un nivel mai jos decat documentul html.. SRC="../../../other/images/chef.gif" nu vreau sa-mi rup limba incercand sa exprim aceasta in cuvinte. Sper ca am fost destul de clar. Mai exista o metoda ca sa poti face acest lucru. La sursa introduceti URL-ul unde se gaseste imaginea. De exemplu: http://www.hair.net/~squiggie/LottzaStu ... s/chef.gif Este o metoda buna cand iti tii pozele pe un alt server decat cel pe care se afla documentele html. Se foloseste frecvent pentru site-urile cu imagini pornografice. http://fbx.ro/ziqrbdshfzdjivl7 - crearea_unei_pagini_web.rar
Modificat de brutus vmd (25-02-2010 20:50:31)