Descrierea limbajului HTML pentru

crearea paginilor Web

1
Cuprins

2
 Prezentarea limbajului HTML

HTML (HyperText Markup Language), creat în Elveţia în anul 1989 este limbajul în care
sunt scrise paginile World Wide Web (WWW). Termenii "document HTML" şi "pagina Web"
sunt sinonime.
Hypertext reprezintă posibilitatea de a crea legături (în engleză - link) între diferite
documente. Markup Language înseamnă "limbaj de etichetare".
Atunci când se crează o pagină în format HTML, ea va avea, în mod inevitabil, această structură:

Multe din trăsăturile lui, cum ar fi independenţa faţă de platformă (un document poate fi
afişat în mod asemănător de computere diferite), structurarea formatării şi legăturile hipertext, fac
din el un foarte bun format pentru documentele Internet şi Web.
Primele specificaţiile de bază ale Web-ului au fost HTML, HTTP şi URL. Utilizarea HTML
propune scrierea textului, tabelelor şi referinţelor la imaginile încadrate în pagina web, iar apoi se
adaugă tag-urile HTML pentru a descrie amplasarea elementelor în pagină. Paginile Web pot fi
vizionate prin intermediul unor programe speciale, numite browsere, care sunt capabile să
interpreteze limbajul HTML. HTML dispune de un set predefinit de tag-uri, nu se pot crea tag-uri
proprii. Pentru a complica lucrurile, există versiuni diferite de browsere şi versiuni diferite ale
limbajului HTML, un tag recunoscut de un browser nu poate fi recunoscut de un browser diferit sau
mai puţin recent.
Exemple de tag-uri HTML:
1. <B>…..</B> Pentru text boldit
2. <U>…..</U> Pentru text subliniat
3. <I>…..</I> Pentru text italic
4. <P>…..</P> Pentru a începe un paragraf nou
5. <TABLE>…..</TABLE> Pentru a insera un tabel
6. <TITLE >…..</TITLE> Pentru a intitula o pagina
Tag-urile HTML indică efectele aplicate diferitelor părţi de pagină în programele browser
(cum ar fi Netscape Navigator si Internet Explorer). Prima versiune a HTML conţinea mai puţin de
30 de tag-uri. Odată cu dezvoltarea web-ului, au apărut mai multe idei pentru îmbunătăţirea
acestuia. În cea mai recentă versiune sunt mai puţin de o sută de tag-uri de bază HTML.
Implementarea efectelor dorite poate fi făcută şi cu un numar mai mic decît acesta. Majoritatea tag-
urilor HTML trebuie sa fie deschise <A>, apoi închise </A>.
Exemplu: Majoritatea programelor de editare a textului pot prezenta textul în font boldit,
italic si subliniat. Codul HTML pentru aceasta propoziţie este: <P> Majoritatea programelor de
editare a textului pot prezenta textul în <B> bold, </B> <I>italic </I> si <U> subliniat </U>. </P>
Tag-urile HTML (<B> si </B>) de pe ambele părţi ale cuvântului “bold” fac ca acest cuvânt sa
apară în bold, chiar daca cuvântul bold nu apare boldit în cod. Tag-urile HTML nu sunt văzute în
browser. Editoarele HTML uşurează munca deoarece sunt capabile să insereze codul HTML în
document. De aceea nu este necesar să se cunoască codul HTML, editorul transformă automat
design-ului un cod HTML.

3
 HTML permite utilizatorilor să producă pagini care includ texte, grafică şi indicatori la alte
pagini de WEB. Pentru ca informaţia din documentul HTML să fie pusă la dispoziţia lumii, acesta
trebuie să fie instalat pe un server WEB. Testarea documentului se poate face cu Nescape Navigator
sau cu Microsoft Internet Explorer.
HTML constă dintr-un standard de coduri care specifică în ce mod documentele vor fi afişate
pe ecran de către navigatoare, sau, mai simplu, se poate spune că reprezintă limbajul de bază al
WWW.
Limbajul prezintă o portabilitate deosebită, un document sursă HTML arătând identic pe
orice tip de calculator şi în orice tip de sistem de operare, sarcina interpretării sale revenind
diferitelor navigatoare. De reţinut că HTML este un limbaj în plină evoluţie, astfel încât navigatoare
diferite vor recunoaşte seturi diferite de elemente HTML..
Hipertext înseamnă că orice cuvânt, frază, imagine sau alt element al documentului văzut de
un utilizator (client) poate face referinţa la un alt document, ceea ce uşurează mult navigarea între
multiple documente sau chiar în interiorul unui aceluiaşi document. Structurarea riguroasă a
documentelor permite convertirea acestora dintr-un format în altul precum şi interogarea unor baze
de date formate din aceste documente.

SGML si HTML
Tim Berners-Lee a utilizat ca model SGML (Standard Generalized Markup Language), un
standard internaţional în plină dezvoltare. SGML avea avantajul unei structurări avansate şi al
independenţei de platformă, dar proiectarea lui a avut în vedere mai mult structura semantică a
documentului decât modul de formatare. Flexibil, SGML putea fi descris ca o specificare pentru
descrierea altor formate. Utilizatorii puteau crea noi formate (DTD, Document Type Definitions)
care puteau fi înţelese de orice produs soft SGML pur şi simplu prin citirea mai întâi a definiţiilor
noilor formate.
HTML este pur şi simplu un DTD, deci o aplicaţie a SGML. În primii ani de evoluţie,
HTML a crescut lent, în principal pentru că îi lipseau posibilităţile de a descrie publicaţii electronice
profesionale; limbajul permitea oarece control asupra fontelor dar nu permitea inserarea graficii.
Documentele HTML sunt documente în format ASCII şi prin urmare pot fi create cu orice
editor de texte.
Orice document HTML începe cu notaţia <html> şi se termina cu notaţia </html>. Acestea
se numesc în literatura de specialitate "TAG-uri". Prin convenţie, toate informaţiile HTML încep
cu o paranteză unghiulară deschisă "<" şi se termină cu o paranteză unghiulară închisă ">".
Tag-urile între aceste paranteze transmit comenzi către browser pentru a afişa pagina într-un
anumit mod. Unele blocuri prezintă delimitator de sfârşit de bloc, în timp ce pentru alte blocuri
acest delimitator este opţional sau chiar interzis.
Între cele doua marcaje <html> şi </html> se vor introduce doua secţiuni:
-secţiunea de antet <head>...</head>
-corpul documentului <body>...</body>.
Blocul <body>...</body> cuprinde conţinutul propriu-zis al paginii HTML, adică ceea ce va fi
afişat în fereastra browser-ului.
O etichetă poate fi scrisă atât cu litere mici, cât şi cu litere mari, adică
<HTML> = <HtmL> = <html>.
Caracterele "spaţiu" şi "CR/LF" ce apar între etichete sunt ignorate de către browser.
În primul rând, titlul unei pagini se obţine inserând în secţiunea <head>...</head> a următoarei
linii:
<title>Aceasta este prima mea pagină de Web </title>
În plus, în secţiunea <body>...</body> putem scrie texte cât dorim. Dacă nu se întâlneşte nici un
marcaj < sau >, atunci interpretorul HTML le va lua ca texte simple şi le va afişa pe ecran.

4
Exemplu:

Conţinutul blocului <title>...</title> va apărea în bara de titlu a ferestrei browser-ului.

Dacă acest bloc lipseşte într-o pagina HTML, atunci în bara de titlu a ferestrei browser-ului va
apărea numele fişierului (în cazul de faţǎ e1_1.html)
Dacă introducem mai multe linii într-o pagină, browser-ul va afişa într-un singur rând, întrucât
caracterele " CR/LF " sunt ignorate de browser. Trecerea pe o linie nouă se face la o comandă
explicită, care trebuie să apară în pagina html.
Această comandă este marcajul <br> ( de la " line break " - întrerupere de linie ).
Folosind operaţiile de mai sus, se poate îmbunătăţi exemplul anterior:

ce are ca rezultat:

5
Blocuri preformatate
Pentru ca browser-ul să interpreteze corect caracterele " spaţiu ", " tab " şi " CR/LF " ce apar în
cadrul unui text, acest text trebuie inclus într-un bloc <pre>...</pre>.
Exemplu:

Fonturi
Un font este caracterizat de următoarele atribute:
• culoare (stabilită prin atributul color);
• tipul sau stilul (stabilit prin atributul face);
• mărimea (definită prin atributul size);
• mărimea în puncte tipografice (stabilită prin atributul point-size);
• grosime (definită prin atributul weight).

Culoarea de fond
O culoare poate fi precizată în două moduri:
• Printr-un nume de culoare. Sunt disponibile cel puţin 16 nume de culori: aqua, black,
fuchsia, gray, green lime, maroon, navy, olive, purple, red, silver, teal, white si yellow.
• Prin constructia " #rrggbb " unde r (red), g (green), sau b (blue) sunt cifre hexazecimale şi
pot lua valorile: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, a, A, b, B, c, C, d, D, e, E, f, F; se pot defini astfel
65536 de culori.
Culoarea unei pagini se precizează prin intermediul unui atribut al etichetei <body>.
Culoarea fondului paginii Web se stabileşte cu atributul bgcolor al etichetei <body>, de exemplu:
<body bgcolor = culoare>.
Următorul exemplu realizează o pagină cu fondul de culoare gri.

6
Culoarea textului
Acest lucru se face prin intermediul atributului text al etichetei <body> după sintaxa:
<body text=culoare>. În următorul exemplu textul are culoarea roşie.

O etichetă poate avea mai multe atribute. De exemplu , o etichetă cu trei atribute arată astfel:
<eticheta atribut1 = valoare1 atribut2 = valoare2 atribut3 = valoare3>.
Poziţionarea conţinutului paginii Web faţă de marginile ferestrei browserului se poate face cu
ajutorul a doua atribute ale etichetei <body>:
• leftmargin ( stabileşte distanţa dintre marginea stânga a ferestrei browserului şi marginea
stânga a conţinutului paginii );
• topmargin ( stabileşte distanţa dintre marginea de sus a ferestrei browserului şi marginea de
sus a conţinutului paginii );
7
Stiluri pentru blocurile de text
Pentru ca un bloc de text să apară în pagină evidenţiat (cu caractere aldine), trebuie inclus
între delimitatorii <b>...</b> ( b vine de la "bold" = îndrăzneţ ).
Pentru ca un text să fie scris cu caractere mai mari cu o unitate decât cele curente acesta
trebuie inclus într-un bloc delimitat de etichetele <big>...</big>.
Pentru ca un text să fie scris cu caractere mai mici cu o unitate decât cele curente acesta
trebuie inclus într-un bloc delimitat de etichetele <small>...</small>.
Pentru ca un text să fie scris cu caractere cursive acesta trebuie inclus într-un bloc delimitat
de etichetele <i>...</i> ( i vine de la " italic ").
Pentru a insera secvenţe de text aliniate ca indice (sub-script) sau ca exponent (super-script),
aceste fragmente trebuie delimitate de etichetele _..., respectiv ^....
Pentru a insera un bloc de caractere subliniate se utilizează etichetele <u>...</u> (u vine de
la " underline ").
Pentru a insera un bloc de caractere secţionate se utilizează etichetele <strike>...</strike>
sau <s>...</s>.
În exemplul următor se utilizează toate etichetele menţionate anterior.

Imbricarea etichetelor
Exemplul următor ilustrează că etichetele pot fi imbricate.
• un fragment de text poate fi scris cu aldine şi cursive în acelaşi timp;
• pentru un fragment de text se pot folosi simultan stilurile subliniat, exponent, mărit şi cursiv.

8
Blocul „q”
Blocul <q>...</q> permite inserarea in-line a citatelor.
" q " vine de la " in-line quotation " (citate inserate in-line);
Şi blocurile " q " pot fi imbricate.

9
Blocuri de text
Aceste etichete nu se referă la particularităţile caracterelor ce compun textul, ci la funcţiile pe care
le poate avea un bloc de text în cadrul paginii Web.
Toate aceste etichete produc automat trecerea la un rând nou şi adăugarea unui spaţiu suplimentar.
Inserarea unei adrese
Dacă într-o pagina web trebuie inclusă o adresă, atunci putem utiliza facilităţile oferite de o
etichetă dedicată: <address>...</address>.
Exemplu:

Indentarea unui bloc

Pentru ca un bloc de text să fie indentat (marginea din stânga a textului să fie deplasată la
dreapta la o anumită distanţă faţă de marginea paginii), acesta trebuie inclus între etichetele
<blockquote>...</blockquote>.
Exemplu:

10
Blocul preformatat
Într-un bloc <pre>...</pre>, semnificaţia marcajelor HTML se păstrează.
Blocul <pre>...</pre> este indicat pentru a insera rânduri vide (spaţiu între rândurile succesive).
Caracterul " spaţiu " poate fi luat în considerare de browser dacă este inserat explicit prin &nbsp;.

Blocuri paragraf
Cu ajutorul etichetei paragraf <p> este posibilă trecerea la o linie nouă şi permite:
• inserarea unui spaţiu suplimentar înainte de blocul paragraf;
• inserarea unui spaţiu suplimentar după blocul paragraf, dacă se foloseşte delimitatorul </p>
(acesta fiind opţional);

11
 • alinierea textului cu ajutorul atributului align, având valori posibile " left ", " center " sau "
right ".
Exemplu:

Blocuri de titlu
Într-un text titlurile (headers) de capitole pot fi introduse cu ajutorul etichetelor <h1>, <h2>,
<h3>, <h4>, <h5>, <h6>.
Toate aceste etichete se referă la un bloc de text şi trebuie însoţite de o etichetă de încheiere
similară.
Aceste etichete acceptă atributul align pentru alinierea titlului blocului de text la stânga (în
mod prestabilit), în centru şi la dreapta. Tag-ul <h1> permite scrierea unui titlu cu caractere mai
mari şi aldine, pe când <h6> foloseşte caracterele cele mai mici.
Exemplu:

12
Linii orizontale
Într-o pagină Web pot fi inserate linii orizontale. Acest lucru se face cu ajutorul etichetei
<hr>. Pentru a configura o linie orizontală se utilizează următoarele atribute ale etichetei <hr>:
• align permite alinierea liniei orizontala. Valorile posibile sunt " left " ," center " şi " right";
• width permite alegerea lungimii liniei;
• size permite alegerea grosimii liniei;
• noshade când este prezent defineşte o linie fără umbră;
• color permite definirea culorii liniei.
Exemplu:

13
Blocuri <center>
Blocul introdus de etichetele <center>...</center> aliniază centrat toate elementele pe care le
conţine.
Exemplu:

Blocuri <nobr>
Blocul de text cuprins între etichetele <nobr>...</nobr> va fi afişat pe o singură linie.
Exemplu:

14
Blocuri <div>
Modalitatea cea mai eficientă de delimitare şi de formatare a unui bloc de text este
folosirea delimitatorilor <div>...</div>. Un parametru foarte util pentru stabilirea caracteristicilor
unui bloc <div> (diviziune) este align (aliniere).
Valorile posibile ale acestui parametru sunt:
• " left " (aliniere la stânga);
• " center " (aliniere centrală);
• " right " (aliniere la dreapta).
Un bloc <div>...</div> poate include alte subblocuri. În acest caz , alinierea precizată de atributul
align al blocului are efect asupra tuturor subblocurilor incluse în blocul <div>;
Un bloc <div>...</div> admite atributul " nowrap " care interzice întreruperea rândurilor de către
browser.
Exemplu:

15
Liste neordonate
O listă neordonată este un bloc de text delimitat de etichetele corespondente <ul>...</ul> (" ul "
vine de la " unordered list " = listǎ neordonatǎ). Fiecare element al listei este iniţiat de eticheta <li>
(list item).
Lista va fi indentată faţă de restul paginii Web şi fiecare element al listei începe pe un rând nou.

Tag-urile <ul> si <li> pot avea un atribut type care stabileşte caracterul afişat în faţa fiecărui
element al listei. Valorile posibile al acestui atribut sunt:
o "circle" (cerc)
• "disc" (disc plin) (valoarea prestabilita);
 "square" (patrat)
Listele neordonate pot fi imbricate pe mai multe niveluri :

Exemplu:

16
Liste ordonate
O listă ordonată de elemente este un bloc de text delimitat de etichetele corespondente
<ol>...</ol> ("ol" vine de la " ordered list " = listă ordonată). Fiecare element al listei este iniţiat de
eticheta <li> (list item).
Lista va fi indentată faţă de restul paginii Web şi fiecare element al listei începe pe un rând nou.
Exemplu:

17
Tag-ul <ol> poate avea atributul type care stabileşte tipul de caractere utilizat pentru ordonarea
listei. Valorile posibile sunt:
• ,,A” pentru ordonare de tipul A, B, C, D etc. (litere mari)
• ,,a” pentru ordonare de tipul a, b, c, d etc. (litere mici)
• ,,I” pentru ordonare de tipul I, II, III, IV etc. (cifre romane mari)
• ,,1” pentru ordonare de tipul 1, 2, 3, 4 etc. (cifre arabe-opţiune prestabilitǎ)
Tag-ul <ol> poate avea atributul start care stabileşte valoarea de plecare a secvenţei de ordonare

Tag-ul <li> poate avea atributul value care stabileşte valoarea pentru elementul respectiv al listei
(aceastǎ valoare trebuie sǎ fie un numǎr întreg pozitiv)

18
19
Tabele
Pentru a insera un tabel se folosesc etichetele <table> .... < / table>.
Un tabel este format din rânduri. Pentru a începe un rând într-un tabel se folosesc etichetele
<tr> … < / tr > (de la ,,table row” = rând de tabel).
Un rând este format din mai multe celule ce conţin date. O celulǎ de date se introduce cu eticheta
<td> (de la ,,table data” = date în tabel).
În mod prestabilit un tabel nu are chenar. Pentru a adǎuga un chenar unui tabel, se utilizeazǎ un
atribut al etichetei <table> numit border.

Atributul border poate sǎ nu fie urmat de nici o valoare, caz în care în care tabelul va avea un
chenar de grosime prestabilitǎ egalǎ cu 1 pixel.
O valoare egalǎ cu 0 a grosimii semnificǎ absenţa chenarului.
Când are grosimea nenulǎ, chenarul unui tabel are un aspect tridimensional.

20
21
Folosirea etichetei de sfârşit < / tr> este opţionalǎ.
Aşa cum am mai spus, atributul border poate sǎ nu fie urmat de nici o valoare, caz în care în care
tabelul va avea un chenar de grosime prestabilitǎ egalǎ cu 1 pixel.
Dimensiunile unui tabel – lǎţimea şi înǎlţimea – pot fi stabilite exact prin intermediul a doua
atribute, width şi height ale etichetei <table>.
Valorile acestor atribute pot fi:
• numere întregi pozitive reprezentând lăţimea respectiv înălţimea în pixeli a tabelului;
• numere întregi între 1 şi 100, urmate de semnul %, reprezentând fracţiunea din lăţimea şi
înălţimea totala a paginii.

Zona din jurul unui tabel

Valoarea atributului hspace a etichetei <table> reprezintǎ distanţa pe orizontalǎ dintre imagine şi
text (spre exemplu)
Valoarea atributului vspace a etichetei <table> reprezintǎ distanţa pe verticalǎ dintre imagine şi text
(spre exemplu)

22
Titlul unui tabel
Unui tabel i se poate ataşa un titlu cu ajutorul etichetei <caption> (de la ,,table caption” =
titlu de tabel). Aceastǎ etichetǎ trebuie plasatǎ în interiorul etichetelor <table>…< / table>, dar nu în
interiorul etichetelor <tr> sau <td> .
Titlul unui tabel poate fi aliniat cu ajutorul atributului align al etichetei <caption> astfel:
• “bottom” (sub tabel)
• “top” (deasupra tabelului)
• “left” (la stânga tabelului)
• “right” (la dreapta tabelului)

23
Cap de tabel
Un tabel poate avea celule cu semnificaţia cap de tabel. Aceste celule sunt introduse în eticheta
<th> (de la ,,table header” = cap de tabel) în loc de <td>.
Obervaţii:
• Toate atributele care pot fi ataşate etichetei <td> pot fi, de asemenea, ataşate etichetei<th>.
• Conţinutul celulelor definite cu <th> este scris cu caractere aldine şi centrat.

24
Extinderea unei celule peste celulele din dreapta ei se face cu atributul colspan, a cǎrui valoare
determinǎ numǎrul de celule care se unificǎ.
Extinderea unei celule peste celulele de dedesubt se face cu atributul rowspan, a cǎrui valoare
determinǎ numǎrul de celule care se unificǎ.

Celule vide ale unui tabel

Dacǎ un tabel are celule de date vide, atunci acestea vor apǎrea în tabel fǎrǎ un chenar de delimitare.
Exemplu: <tr><td><td>
În scopul de a afişa un chenar pentru celulele vide, se utilizeazǎ urmǎtoarele trucuri:
• dupǎ <td> se pune caracterul &nbsp; (no break space)
SAU:
• dupǎ <td> se pune <br>
(ambele afişeazǎ un chenar pentru celule vide)

25
Alte atribute ale etichetei <table>:
• background permite stabilirea unei imagini pentru fondul unui tabel
• bordercolor permite stabilirea întregii culorii pentru chenarul unui tabel
( bordercolorlight permite stabilirea unui colţ colorat pentru chenarul 3D al unui tabel)
( bordercolordark permite stabilirea altului colţ colorat pentru chenarul 3D al unui tabel)

26
Grupuri de coloane
Blocul <colgroup> < / colgroup> permite definirea unui grup de coloane.
Atribute acceptate de <colgroup>:
• span determinǎ numǎrul de coloane dintr-un grup
• width determinǎ o lǎţime unicǎ pentru coloanele din grup
• align determinǎ un tip unic de aliniere pentru coloanele din grup

Într-un bloc <colgroup>, coloanele pot avea configurǎri diferite dacǎ se utilizeazǎ elementul <col>,
care admite atributele:
• span identificǎ acea coloanǎ din grup pentru care se face configurarea. Dacǎ lipseşte, atunci
coloanele sunt configurate în ordine;
• width determinǎ o laţime pentru coloana identicǎ prin span;
• align determinǎ o aliniere pentru coloana identicǎ prin span.

27
Atributul rules al etichetei <table> permite alegerea unor delimitatori pentru celulele unui tabel.
Valorile posibile sunt: all, cols, rows, none.

Imagini
Pentru a insera o imagine într-o pagina, se utilizează eticheta <img> (de la "image"=imagine).
Pentru a putea fi identifică imaginea care va fi inserată, se utilizează un atribut al etichetei <img> şi
anume src (de la "source"=sursǎ). Valoarea acestui atribut este adresa URL a imaginii.
Dacă imaginea se află în acelaşi director cu fişierul HTML care face referire la imagine,
atunci adresa URL a imaginii este formată numai din numele imaginii, inclusiv extensia.

28
Un tabel de imagini

29
Un tabel de tabele de imagini şi texte
Exemplul urmǎtor prezintǎ un tabel cu un rând având douǎ celule. Fiecare celulǎ a tabelului este
formatǎ dintr-un nou tabel care conţine douǎ rânduri. În rândul de sus se aflǎ o imagine, iar în
rândul de jos un text explicativ privind imaginea.

Imagini folosite ca legături

O legătura (link) introduce în pagina Web o zona activă.
Efectuând click cu butonul mouse-ului pe aceasta zona în browser se va încărca o altă pagină.
În mod prestabilit imaginea utilizatǎ pe post de zona activǎ este înconjuratǎ de un chenar având
culoarea unei legături.

30
Am utilizat imaginea poz11.gif drept legǎturǎ cǎtre pagina e7_1.html. Fǎcând click acum pe
imagine se deschide:

Fǎcând click pe textul subliniat apare:

31
Metainformaţiile, adicǎ informaţiile despre conţinutul unei pagini Web, se introduc cu ajutorul unui
element special <meta> plasat în interiorul blocului <head> </head>. Acest element acceptǎ
patru atribute
• name
• content
• http-equiv
• scheme,
la care se adaugǎ un atribut universal (comun tuturor elementelor): lange

Metainformaţiile nu sunt vizibile în interiorul unei pagini Web. Ele sunt conţinute în fişierul
sursǎ . html
Din meniul View → Source. Apare:

32
Atributul name poate fi utilizat pentru a furniza informaţii legate de autorul paginii si de drepturile
de autor:

Pentru a transmite serverelor data creǎrii şi data ractualizǎrii unei pagini Web, se utilizeazǎ atributul
http-equiv. Valoarea atributului content este
“zzz zz lll aaaa hh:mm:ss ttt”, unde:
• “zzz” reprezintǎ primele trei litere ale zilei din sǎptǎmânǎ (Mon, Tue, Wed, Thu, Fri, Sat,
Sun)
• “zz” reprezintǎ ziua din cadrul lunii (01, 02, 03,…,31)
• “lll” reprezintǎ primele trei litere din numele lunii (Jan, Feb, Mar, Apr, May, Jun, Jul, Aug,
Sep, Oct, Nov, Dec)
• “aaaa” reprezintǎ anul exprimat cu patru cifre (de exemplu 2003)
• hh:mm:ss” reprezintǎ ora, minutul şi secunda
• “ttt” reprezintǎ standardul de timp utilizat (de exemplu GMT)

Observaţie:
Dacǎ data este furnizatǎ într-un format ambiguu (de exemplu ,,03-07-1999”), atunci adǎugaţi
atributul scheme care precizeazǎ formatul utilizat pentru datǎ (de exemplu scheme = ”Month-Day-
Year”)

33
 Pentru a putea furniza informaţii despre persoana care administreazǎ site-ul, utilizaţi atributul
http-equiv ca în exemplul urmǎtor. În aceste cazuri, valoarea atributului content este o adresǎ
e-mail, eventual urmatǎ, între paranteze rotunde, de un nume complet al persoanei.

Pentru a reîncǎrca aceeaşi paginǎ la un interval precizat de secunde, folosiţi atributul http-equiv cu
valoarea “refresh”, iar în atributul content introduceţi numǎrul de secunde dupǎ care doriţi ca
pagina sǎ fie reactualizatǎ.

Dupǎ 5 secunde apare din nou:

34
Dacǎ dorim ca dupǎ un numǎr de secunde o pagina sǎ fie înlocuitǎ de o alta, atunci în atributul
content este precizatǎ şi adresa URL a paginii noi:

Dupǎ 9 secunde apare:

Legǎturi
O legǎturǎ cǎtre o paginǎ aflatǎ în acelasi director se formeazǎ cu ajutorul etichetei <a> (de
la ,,anchor”=ancorǎ). Pentru a preciza pagina indicatǎ de legǎturǎ se utilizeazǎ un atribut al etichetei
<a> numit href, care ia valoare numele fişierului HTML aflat în acelaşi director, care va înlocui
vechea paginǎ. Prezenţa etichetei de sfârşit < / a> este obligatorie.
Urmǎtorul exemplu admite cǎ în acelaşi director (de exemplu, în directorul de lucru C:\ bew) se aflǎ
douǎ fişiere HTML, p1.html şi p2.html:

35
Cele douǎ fişiere se deschid unul dupǎ altul prin apǎsarea unui click pe textul subliniat.

O legǎturǎ cǎtre o paginǎ aflatǎ pe acelaşi disc local

Presupunem acum cǎ pagina referitǎ de legǎturǎ se aflǎ pe acelaşi disc local, dar într-un alt director.
Exemplul urmǎtor presupune cǎ p3.html se aflǎ în directorul C: \ bew \ a \ , iar p4.html se aflǎ în
directorul C: \ bew \ b \ bb \ .

36
Cele douǎ fişiere se deschid când unul când altul prin apǎsarea unui singur click pe textul subliniat.

Ancore
Într-o pagină foarte lungă pot exista puncte de reper (ancore) către care se definesc legături.
O ancoră se defineşte de asemenea prin eticheta <a>. Pentru a defini ancora se utilizează atributul
name care primeşte ca valoare un nume atribuit ancorei (de exemplu "ancora1").
Pentru a insera o legătura către "ancora1" definită în aceeaşi pagină se utilizează eticheta <a> având
atributulhhrefn de valoare "#ancora1". .

37
Fǎcând click pe primul text subliniat apare:

Se revine în paginǎ cu ajutorul butonului .

Fǎcând click pe al doilea text subliniat apare:

38
Pentru a introduce o legǎturǎ cǎtre o ancorǎ definitǎ în alt document (altǎ paginǎ) aflat în acelaşi
director, atributul href primeşte o valoare de forma
“nume_fişier.html#nume_ancora”

Fǎcând click pe primul text subliniat apare:

39
Se revine în paginǎ cu ajutorul butonului .
Fǎcând click pe al doilea text subliniat apare:

Dacǎ dorim ca pagina solicitatǎ sǎ fie încǎrcatǎ într-o altǎ fereastrǎ decât cea curentǎ, atunci trebuie
lansatǎ în execuţie o nouǎ instanţǎ a browserului care va conţine noua paginǎ. Acest lucru se
realizeazǎ folosind atributul target al etichetei <a>, care primeşte ca valoare un nume (de
exemplu ,,fereastra”) pentru fereastra în care se va încǎrca noua paginǎ.

40
Dacǎ mai multe legǎturi folosesc aceeaşi valoare pentru atributul target, înseamnǎ cǎ paginile
referite de acestea se vor încǎrca în aceeaşi fereastrǎ.

41
Ancore definite prin atributul id
Atributul id este un atribut universal, adicǎ poate fi ataşat oricǎrui element al unei pagini Web.
Acest atribut va înlocui complet atributul name, care putea fi ataşat numai anumitor elemente.
Atributul id primeşte ca valoare un nume (de exemplu ,,id1”) care identificǎ în mod unic un
element.
Atributul id poate fi utilizat pe post de ancorǎ într-o paginǎ Web conform sintaxei:

<a href = “#id1”> …</a>

<eticheta id =”id1”>…</eticheta>

Fǎcând click pe primul text subliniat apare:

Se revine în paginǎ cu ajutorul butonului .

Fǎcând click pe al doilea text subliniat apare:

42
Atributul title aparţine etichetei <a> şi comandǎ apariţia unei mici ferestre în pagina Web când
mouse-ul se aflǎ pe o legǎturǎ, fereastrǎ în care este afişatǎ valoarea datǎ acestui atribut. Acest
atribut are astfel menirea de a furniza informaţii suplimentare despre semnificaţia unei legǎturi.

Fǎcând click pe textul subliniat apare:

43
Pentru ca vizitarea unei pagini Web sǎ fie însoţitǎ de un sunet de fond, browserul Internet
Explorer acceptǎ eticheta <bgsound>. Fişierul care stocheazǎ sunetul este precizat printr-un atribut
al etichetei <bgsound>, şi anume src (de la ,,source” = sursǎ).
Un al doilea atribut al etichetei <bgsound>, şi anume loop permite precizarea numǎrului de
repetiţii care sunt executate pânǎ când sunetul de fond înceteazǎ. Valorile posibile sunt:
• ,,-1” sau ,,infinite” pentru ca sunetul de fond sǎ se repete de un numǎr
infinit de ori
• un numǎr întreg pozitiv care precizeazǎ de câte ori sǎ se repete sunetul

Stilurile dedicate se aplicǎ numai blocurilor de text pentru care sunt definite.
În blocul <head…< / head> se insereazǎ un bloc <style>…< / style>
(în exemplul de mai jos dorim ca toate titlurile de mǎrimea 1 sǎ fie centrate şi de culoare roşie)

44
Observaţie: Dacǎ dorim ca acelaşi stil sǎ fie utilizat de cǎtre mai multe elemente (de exemplu
,,h1”, ,,h2” şi ,,p”) atunci se procedeazǎ ca în exemplul de mai jos:

45
Clasele de stiluri permit definirea unui stil general şi folosirea lui acolo unde este necesar.
Procedǎm astfel:
1. Definim o clasǎ de stiluri ,,rc” (roşu şi centrat) în interiorul blocului <style>…< / style> aflat la
rândul lui în blocul <head>…< / head>:
<style>
. rc {text-align : center ; color : red ; }
<style>
Observaţie: Locul liber aflat în faţa clasei de stiluri ,,rc” indicǎ faptul cǎ aceastǎ clasǎ este
aplicabilǎ tuturor blocurilor de text, atunci când este necesar.
2. Dacǎ dorim ca un titlu de mǎrimea 2 sǎ foloseascǎ aceastǎ clasǎ de stiluri atunci scriem:
<h2 class=rc>…< / h2>

Observaţie: Dacǎ dorim ca o clasǎ de stiluri sǎ fie aplicabilǎ pentru anumite elemente ale
documentului (de exemplu ,,p”), atunci:

46
Stiluri ,,identificate”
Toate elementele unui document admit un atribut universal numit id. Acest atribut înlocuieşte un
atribut mai vechi name şi are rolul de a identifica în mod unic un element în cadrul unui
document.
Atributul id poate identifica stilul utilizat de un element.
Pentru a utiliza un stil ,,identificat”, procedaţi astfel:
1. <style>
#VERDE {color : green ; }
<style>
2. În elementul în care se doreşte utilizarea localǎ a acestui stil, folosiţi atributul id care primeşte ca
valoare numele stilului definit anterior

47
Dacǎ dorim ca un stil ,,identificat” sǎ fie aplicabil numai pentru anumite elemente ale documentului
(de exemplu ,,h2”), atunci:

Pentru ca toate blocurile de text cursiv dintr-un bloc de text de tip paragraf sǎ fie de culoare roşie,
atunci:
<style>
p , i {color : red ; }
<style>

48
Stiluri in-line sunt definite chiar în eticheta ce iniţiazǎ blocul în care dorim sǎ se aplice aceste
stiluri:

În cazul în care dorim utilizarea unui anumit stil pentru un fragment de text, atunci includem
acest text într-un bloc cu ajutorul delimitatorilor <span>…< / span> dupǎ care utilizǎm atributul
style pentru eticheta <span>

49
Stiluri definite în fişiere externe
Procedǎm astfel:
1. Se creazǎ un fişier stiluri.html (conţinutul acestui fişier coincide cu conţinutul unui bloc
<style>…< / style>, fǎrǎ ca aceşti delimitatori sǎ fie incluşi)

2. În fişierul urmǎtor pe care-l vom numi e15_10.html includem în blocul <head>…< / head> o
etichetǎ <link> având atributele:
• atributul rel cu valoarea “stylesheet”
• atributul type cu valoarea “text/css”
• atributul href având ca valoare adresa URL a fişierului creat anterior.

Exemplul este echivalent ca efect cu e15_5

50
Dacǎ un atribut are valoarea ,, ! important ”, atunci el are prioritate maximǎ.

Tipul fontului poate fi stabilit cu ajutorul atributului font-family.

51
Grosimea fontului poate fi stabilitǎ cu ajutorul atributului font-weight. Valorile posibile sunt:
• normal
• bold
• bolder
• lighter
• valori numerice între 100 (pentru fontul cel mai subţire) şi 900 (pentru fontul cel mai gros)

52
Stilul fontului poate fi stabilit cu ajutorul atributului font-style.
Valorile posibile sunt:
• normal
• italic

Variantele fontului pot fi stabilite cu ajutorul atributului font-variant.

Valorile posibile sunt:
• normal
• small-caps

53
CADRE în HTML

Ferestrele sau (cadrele) ne permit să definim în fereastra browserului subferstre în care să fie
încărcate documente HTML diferite. Ferestrele sunt definite într-un fişier HTML special , în care
blocul <body>...</body> este înlocuit de blocul <frameset>...</frameset>. În interiorul acestui
bloc, fiecare cadru este introdus prin eticheta <frame>.
Un atribut obligatoriu al etichetei <frame> este src, care primeşte ca valoare adresa URL a
documentului HTML care va fi încărcat în acel frame. Definirea cadrelor se face prin împărţirea
ferestrelor (şi a subferestrelor) în linii şi coloane:
• împărţirea unei ferestre într-un număr de subferestre de tip coloana se face cu ajutorul
atributului cols al etichetei <frameset> ce descrie acea fereastră;
• împărţirea unei ferestre într-un număr de subferestre de tip linie se face cu ajutorul
atributului rows al etichetei <frameset> ce descrie acea fereastră;
• valoarea atributelor cols şi rows este o listă de elemente separate prin virgulă , care descriu
modul în care se face împărţirea.
Elementele listei pot fi:
1. un număr întreg de pixeli;
2. procente din dimensiunea ferestrei (număr între 1 şi 99 terminat cu %);
3. n* care înseamnă n părţi din spaţiul rămas;
Exemplu 1: cols = 200, *, 50%, * înseamnă o împărţire în 4 subferestre , dintre care prima are 200
pixeli , a treia ocupă jumătate din spaţiul total disponibil, iar a doua şi a patra ocupă în mod egal
restul de spaţiu rămas disponibil.
Exemplu 2: cols = 200, 1*, 50%, 2* înseamnă o împărţire în 4 subferestre, dintre care prima
are 200 pixeli , a treia ocupa jumătate din spaţiul total disponibil iar a doua şi a patra ocupa în mod
egal restul de spaţiu rămas disponibil, care se împarte în trei părţi egale, a doua fereastră ocupând
o parte, iar a patra ocupând 2 părţi.
Observaţii:
-dacă mai multe elemente din listă sun configurate cu * , atunci spaţiul disponibil rămas pentru
ele se va împărţi în mod egal.
- o subfereastră poate fi un cadru (folosind <frame>) în care se va încărca un document
HTML, sau poate fi împărţită la rândul ei la alte subfereste (folosind <frameset>).

54
În exemplul următor este creată o pagină Web cu trei cadre orizontale. Pentru al doilea cadru
valoarea atributului src este adresa URL a unei imagini.

55
În exemplul urmǎtor este creatǎ o matrice de 4 cadre (2 X 2).

În exemplul urmǎtor este creatǎ o paginǎ Web cu trei cadre mixte. Pentru a o crea, se procedeazǎ din
aproape în aproape. Mai întâi, pagina este împǎrţitǎ în douǎ subferestre de tip coloanǎ, dupǎ care a
doua subfereastrǎ este împarţitǎ în douǎ subferestre de tip linie.

56
În exemplul urmǎtor pagina Web este construitǎ cu ajutorul a douǎ fişiere HTML ( pagina este
identicǎ cu cea anterioarǎ)

57
Culori pentru chenarele cadrelor şi dimensionarea chenarului unui cadru
Pentru a stabili culoarea chenarului unui cadru se utilizează atributul bordercolor. Acest atribut
primeşte ca valoare un nume de culoare sau o culoare definită în conformitate cu modelul de
culoare RGB. Atributul bordercolor poate fi ataşat atât etichetei <frameset> pentru a stabili
culoarea tuturor chenarelor cadrelor incluse, cât şi etichetei <frame> pentru a stabili culoarea
chenarului pentruaunacadruaindividual.

Atributul border al etichetei <frameset> permite configurarea lăţimii chenarelor tuturor cadrelor la
un număr dorit de pixeli.
Valoarea prestabilită a atributului border este de 5 pixeli.
O valoare de 0 pixeli va defini un cadru fără chenar.

58
În exemplul urmǎtor se utilizeazǎ border = ”0” pentru a obţine cadre fǎrǎ chenar.

În mod prestabilit, chenarul unui cadru este afişat şi are aspect tridimensional. Afişarea chenarului
unui cadru se poate dezactiva dacă se utilizează atributul frameborder cu valoare "no". Acest
atribut poate fi ataşat atât etichetei <frameset> (dezactivarea fiind valabilă pentru toate cadrele
incluse) cât şi etichetei <frame> (dezactivarea fiind valabilă numai pentru un singur cadru).
Valorile posibile ale atributului frameborder sunt: :
59
 - "yes"- echivalent cu 1 ;
- "no" -echivalent cu 0;

Bare de defilare
Atributul scrolling al etichetei <frame> este utilizat pentru a adăuga unui cadru o bară de
derulare care permite navigarea în interiorul documentului afişat în interiorul cadrului.
Valorile posibile sunt:
• "yes" - barele de derulare sunt adăugate întotdeauna;
• "no" - barele de derulare nu sunt utilizabile;
• "auto" - barele de derulare sunt vizibile atunci când este necesar
Atributul noresize al etichetei <frame> (fără nici o valoare suplimentară) dacă este prezent, inhibă
posibilitatea prestabilită a utilizatorului de a redimensiona cadrul cu ajutorul mouse-ului.

60
Poziţionarea documentului într-un cadru
Atributele marginheight şi marginwidth ale etichetei <frame> permit stabilirea distanţei
în pixeli dintre conţinutul unui cadru şi marginile verticale, respectiv orizontale ale cadrului.
Valori posibile:
- număr de pixeli;
- procent din lăţimea, respectiv din înălţimea cadrului;

Ţinte pentru legături

În mod prestabilit, la efectuarea unui clic pe o legătură, noua pagină (către care indică
legătura) o înlocuieşte pe cea curentă în aceeaşi fereastră (acelaşi cadru). Acest comportament se
poate schimba în două moduri:
61
• prin plasarea în blocul <head>...</head> a unui element <base> care precizează, prin
atributul target numele ferestrei (cadrului) în care se vor încărca toate paginile noi referite
de legăturile din pagina curentă conform sintaxei:
<base target="nume_fereastra/frame_de_baza">
• prin plasarea în eticheta <a> a atributului target, care precizează numele ferestrei (cadrului)
în care se va încărca pagina nou referită de legătura, conform sintaxei:
<a href="legătura" target="nume_fereastra/frame">...</a>

62
 main

left

Fǎcând clic pe primul textul subliniat apare: Fǎcând clic pe al doilea text subliniat apare:

63
 APLICAŢIE HTML
- scurta prezentare a sistemelor de operare Windows şi Linux -

Fişierul: Index.htm
<html>
<head>
<title>Windows versus Linux</title>
</head>
<frameset rows="84,*" border="0">
<frame name="antet" scrolling="no" noresize src="antet.htm" target="contents">
<frameset cols="211,*">
<frame name="meniu" target="continut" src="meniu.htm" scrolling="no">
<frame name="continut" src="SistemeOperare.htm" scrolling="auto">
</frameset>
</frameset>
</html>

Fişierul: antet.htm
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>Windows versus Linux</title>
<base target="contents">
</head>
<body bgcolor="AliceBlue">
<table border="1" width="100%" bgcolor="White" height="100%" bordercolor="Navy">
<tr>
<td bordercolor="White" rowspan="2">
<img src="win.jpg" height="57"></td>
<td bordercolor="White"><b>
<font size="5" color="silver" face="Tahoma">Windows versus
Linux</font></b></td>
<td bordercolor="White" rowspan="2">
<img src="lin.gif" height="57"></td>
</tr>
<tr>
<td bordercolor="White">
<p align="center"><font face="Arial" size="2" color="Navy">O scurta prezentare a
celor doua sisteme de operare</font></td>
</tr>
</table>
</body>
</html>

Fişierul: AvantajeLinux.htm
<html>
<head>
<title>Prezentare sisteme de operare</title>
<link rel="stylesheet" type="text/css" href="stil.css">
</head>

64
<body>
<center>
<h1>Linux. Avantaje</h1>
</center>
<hr color="#000080" size="1" noshade>
<p>Multe companii au decis alegerea Linux-ului ca sistem de operare datorita
sigurantei sale si a investitiilor mai mici decat in cazul altor produse
similare, chiar daca de obicei este necesara &quot;alfabetizarea&quot; angajatilor.
Inexistenta unui suport tehnic adecvat nu mai constituie o problema in ziua de
azi, multi producatori oferind aceasta optiune la un pret accesibil. Un alt
avantaj este protectia impotriva virusilor: in comparatie cu alte sisteme pentru
care s-au scris zeci de mii de virusi, pentru Linux exista doar cateva zeci,
putini fiind cei care sa se incumete sa scrie coduri malitioase destinate
acestei platforme; totusi aceasta situatie poate fi pusa si pe seama raspandirii
mai mici de care da dovada Linux printre utilizatorii obisnuiti.<p>Baza
sistemului de operare Linux o reprezinta securitatea si scalabilitatea pentru
care el este deja este cunoscut in mediul Internet, devenind astfel o alegere
pentru tot mai multe companii. Linux ofera si o interfata grafica ce poate fi
comparata cu cea pusa la dispozitie de Windows, conceptul de &quot;user friendly&quot;
fiind bine implementat; baza de date pentru suport hardware se mare&#351;te pe zi ce
trece, uneori durand doar cateva zile de la lansarea unui produs pana la
aparitia unui driver scris pentru Linux. Blamat odata pentru lipsa facilitatilor
multimedia, Linux ofera din ce in ce mai multe unelte pentru editare video,
muzica etc.
</body>
</html>

Fişierul: contact.htm
<html>
<head>
<title>Prezentare sisteme de operare</title>
<link rel="stylesheet" type="text/css" href="stil.css">
</head>
<body>
<center><h1>Va rog sa-mi scrieti</h1></center>
<hr color="Navy" size="1" noshade>
<form method="POST" action="mailto:cdomanid@yahoo.com">
<table border="0" width="100%">
<tr>
<td bgcolor="AliceBlue" align="right"><b>
<font face="Arial" size="2" color="Navy">Numele - </font></b></td>
<td><input type="text" name="nume" size="20" class="formular"></td>
</tr>
<tr>
<td bgcolor="AliceBlue" align="right"><b>
<font face="Arial" size="2" color="Navy">Adresa de e-mail -
</font></b></td>
<td><input type="text" name="adresa" size="20" class="formular"></td>
</tr>
<tr>
<td bgcolor="AliceBlue" align="right"><b>
<font face="Arial" size="2" color="Navy">Comentarii - </font></b></td>

65
 <td><textarea rows="4" name="comentariu" cols="35"
class="formular"></textarea></td>
</tr>
<tr>
<td colspan="2">
<p align="center">
<input type="submit" value="Trimite cometariile" name="trimite"
class="formular"></td>
</tr>
</table>
</form>
</body>
</html>

Fişierul: linuxPrezentare.htm
<html>
<head>
<title>Prezentare sisteme de operare</title>
<link rel="stylesheet" type="text/css" href="stil.css">
</head>
<body>
<center><h1>Prezentarea sistemului de operare <u>Linux</u></h1></center>
<hr color="Navy" size="1" noshade>
<p>Incepand cu a doua jumatate a anului 1991 pe piata produselor software a
aparut o versiune speciala a sistemului de operate Unix numita <b>LINUX</b>.<p>
Principalele caracteristici ale sistemuli de operare Linux sunt:<ul>
<li>este un sistem multiuser si multiproces avand toate caracteristicile
sistemului de operare Unix</li>
<li>spre deosebire de Windows, Linux este disponibil in cod sursa in mod
gratuit</li>
<li>poate fi utilizat la creearea unui server de birou, de WEB, precum si a
unui mediu de programare sau pentru gestionarea unei masini multimedia</li>
<li>poate fi procurat in mai multe variante de distribuire cum ar fi:
RedHat, Debian, Suse, Mandrake, etc</li>
</ul>
</body>
</html>

Fişierul: meniu.htm
<html>
<head>
<title>meniu</title>
<style>
<!--
a { font-family: Tahoma; font-size: 10pt; color: Brown }
-->
</style>
<base target="continut">
</head>
<body bgcolor="AliceBlue">
<table border="1" width="100%" bgcolor="White" bordercolor="navy">
<tr>

66
 <td bordercolor="White"><b><font face="Verdana">Sisteme de
operare</font></b></td>
</tr>
</table><font color="brown" face="tahoma" size=2>
<ul>
<li><a href="SistemeOperare.htm">Ce sunt?</a></li>
</ul></font>
<table border="1" width="100%" bgcolor="White" bordercolor="Navy">
<tr>
<td bordercolor="White"><b><font face="Verdana">Windows</font></b></td>
</tr>
</table>
<ul>
<li><a href="winPrezentare.htm">Caracteristici</a></li>
<font color="brown" face="tahoma" size=2>
</ul></font>
<table border="1" width="100%" bgcolor="White" bordercolor="Navy">
<tr>
<td bordercolor="White"><b><font face="Verdana">Linux</font></b></td>
</tr>
</table>
<ul>
<li><a href="linuxPrezentare.htm">Prezentare</a></li>
<li><a href="AvantajeLinux.htm">Avantaje</a></li>
</ul>
<hr noshade color="Silver" size="1">
<p align="center">
<a href="contact.htm"><font face="Arial" size="1" color="Silver">Contact</font></a></p>
</body>
</html>

Fişierul: SistemeOperare.htm
<html>
<head>
<title>Prezentare sisteme de operare</title>
<link rel="stylesheet" type="text/css" href="stil.css">
</head>
<body>
<center><h1>Prezentarea sistemelor de operare</h1></center>
<hr color="Navy" size="1" noshade>
<p>Un sistem informational de prelucrare automata a datelor, dispune pe langa o
componenta fizica, materiala, sub forma sistemului de echipamente si de o
componenta informationala. Aceasta componenta este alcatuita la randul ei
dintr-un prim nivel format din <font color="#008080">ansamblul programelor care
asigura indeplinirea functiilor sistemului de echipamente</font> si din
<font color="#008080">programe care asigura efectiv prelucrarea automata a
datelor</font>.</p>
<p>Programele de baza care fac parte din primul nivel a componentei
informationale, pot fi grupate in doua mari categorii:</p>
<ul>
<li>programe ale sistemului de operare</li>
<li>programe utilitare, de serviciu si traducatoare</li>
</ul>
67
<p>Principalele sisteme de operare utilizate in prezent sunt:</p>
<ul>
<li><a target="_blank" href="http://www.unix.org">Unix</a></li>
<li><a target="_blank" href="http://www.microsoft.com">Windows</a></li>
<li><a target="_blank" href="http://www.linux.org">Linux</a></li>
<li><a target="_blank" href="http://www.apple.com/macosx">Mac OS X</a></li>
</ul>
</body>
</html>

Fişierul: winPrezentare.htm
<html>
<head>
<title>Prezentare sisteme de operare</title>
<link rel="stylesheet" type="text/css" href="stil.css">
</head>
<body>
<center><h1>Prezentarea sistemului de operare <u>Windows</u></h1></center>
<hr color="Navy" size="1" noshade>
<p>Microsoft Windows este un mediu de operare
si programare care ofera utilizatorilor o interfata grafica prietenoasa, bazata
pe ferestre ecran si mijloace de interactiune moderne: meniuri, butoane
simultane pe ecran, cursoare grafice, "cutii" de dialog si altele. Aceasta
explica marea popularitate de care se bucura, mai ales dupa aparitia ultimelor
sale versiuni.</p>
<p>Principalele caracteristici a sistemului de operare
Windows sunt:</p>
<table border="0" width="100%">
<tr>
<td width="50%" valign="top">
<ul>
<li>elementele 3D tind sa domine interfata grafica</li>
<li>existenta mecanismulului &quot;obiectele legate si incluse&quot; OLE,
care
permitea legarea dinamica a unor obiecte intr-un document complex</li>
<li>problema fonturilor a fost rezolvata prin introducerea
posibilitatilor de actualizare a lor prin promovarea caracterelor
True Type (corpurile de litera True Type sunt scalabile, adica
micsorate sau marite isi pastreaza forma lizibila - tehnologiile
anterioare necesitau un set diferit de corpuri de litera pentru
fiecare dimensiune in parte)</li>
</ul>
</td>
<td width="50%" valign="top">
<ul>
<li>posibilitatea utilizarii memoriei virtuale prin utilizarea unui
spatiu de pe harddisk pentru a simula o memorie RAM</li>
<li>capacitatea imbunatatita de utilizare si gestionare a driverelor</li>
<li>multitasking permitiv (controlat): Windows detine tot timpul
controlul asupra timpului de calcul si asupra aplicatiilor</li>
<li>include standardul Plug &amp; Play ca parte integranta a sistemului
de operare</li>
<li>are o interfata de programare a aplicatiilor API (Aplications
68
 Programs Interface) pe 32 de bitiultimele variante de sisteme
Windows sunt multiuser</li>
</ul>
</td>
</tr>

69