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>
document HTML (</HTML>
sfarsit.

si acesta este sfarsitul unui

. 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>

frumos

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.
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)