11
1.Notiuni introductive 2.Editarea si vizualizarea unui document HTML 3.HTML de baza 3.1. Structura unui document HTM 3.2. Parametrii marcajului <BODY>…</BODY> •Parametrul bgcolor •Parametrul background •Parametrul TEXT •Parametrul LINK •Parametrul VLINK •Parametrul ALINK Grup Scoalr Agricol “V. Adamachi” Iasi

Limbajul HTML

Embed Size (px)

DESCRIPTION

Limbajul HTML. Limbajul HTML. Limbajul HTML. Grup Scoalr Agricol “V. Adamachi” Iasi. Subiectele lectiei:. 1.Notiuni introductive 2.Editarea si vizualizarea unui document HTML 3.HTML de baza 3.1. Structura unui document HTM 3.2. P arametrii marcajului … - PowerPoint PPT Presentation

Citation preview

Page 1: Limbajul HTML

1.Notiuni introductive

2.Editarea si vizualizarea unui document HTML

3.HTML de baza

3.1. Structura unui document HTM

3.2. Parametrii marcajului <BODY>…</BODY>•Parametrul bgcolor •Parametrul background •Parametrul TEXT •Parametrul LINK •Parametrul VLINK •Parametrul ALINK

Grup Scoalr Agricol “V. Adamachi” Iasi

Page 2: Limbajul HTML

HTML e acronimul de la HyperText Markup Language, care e numele unui limbaj de marcare.

A fost conceput în 1989 de Tim Berners-Lee, licentiat la Oxford, pe atunci fizician. Fiind si expert în software, Berners-Lee e acum director al World Wide Web Consortium ( pe scurt, W3C ), adica al organizatiei care coordoneaza dezvoltarea web-ului ( în principal, prin impunerea de standarde pentru limbaje etc. ). Fiind un limbaj de marcare, HTML nu utilizeaza instructiuni ( ca Pascal-ul sau C-ul ) ori comenzi ( ca Fox-ul ), ci etichete, acestea fiind numite si balize, elemente sau tag-uri.

Sintaxa oricarui tag este: <TAG atribut1="val" atribut2="val">Text</TAG> O pagina web poate contine:

• text • imagini • fisiere audio • fisiere video

Paginile web se vizualizeazã în browsere, care sunt niste programe de vizitare. Cele mai populare browsere sunt:

1. Netscape Navigator2. Microsoft Internet Explorer

Lectura facultativa

Pagina anterioara Pagina urmatoare

1.Notiuni introductive

Page 3: Limbajul HTML

2. Editarea si vizualizarea unui document HTMLEditarea unui document HTML

Pentru editarea unui document Html se pot folosi procesorele de text Notepad, WordPad sau un editor specializat in crearea paginilor Web.

Lansarea in executie a procesorului de texte Notepad:

Start Programs Accessories Notepad

Page 4: Limbajul HTML

2. Editarea si vizualizarea unui document HTMLCrearea unui document

File New sau folosind tastele Alt+F, apoi tasta N

Salvarea unui document ca document HTML

File Save sau folosind tastele Alt+F, apoi tasta S

In fereastra Save parcurgeti urmatoarele etape:

Pas1: din lista ascunsa Save In alegeti directorul in care salvati documentul

Pas2: scrieti in zona de editare File name numele pe care doriti sa il dati documentului adaugand extensia html sau htm

Pas3: actionati declansatorul Save

Page 5: Limbajul HTML

2. Editarea si vizualizarea unui document HTMLDeschiderea unui document HTML

File Open sau Alt+F dupa care tasta O

In fereastra Open se parcurg urmatorii pasi:

Pas1: din lista ascunsa Save as Type alegeti tipul documentului

Pas2:din lista ascunsa Look in alegeti directorul in care se gaseste documentul pe care doriti sa-l decshideti

Pas3:in casuta de dialog File name scrieti numele documentului pe care doriti sa-l deschideti sau selectati cu mose-ul documentul respectiv

Pas4:actionati declasantorul Open

Page 6: Limbajul HTML

3. HTML de baza3.1. Structura unui document HTML

<HTML>

<HEAD>

<TITLE> structura paginii mele

</TITLE>

</HEAD>

<BODY>

Continutul paginii mele este acesta

</BODY>

</HTML>

Structura unui document html se delimiteaza de urmatoarele marcaje:

•Marcajul de specificare a documentului de tip hipertext

•Marcajul de specificare a capului documentului de tip hipertext

delimiteza informatiile referitoare la crearea paginii Web, informatii ce nu vor aparea la vizualizarea paginii respective cu un program de navigare

marcajul <TITLE>..</TITLE>delimiteaza un nume pe care dorim sa-l dam paginii ce urmeaza s-o realizam si care va aparea in bara de stare a programului de navigare

•Marcajul de specificare a corpului documentului de tip hipertext

Acest marcaj cuprinde continutul paginii Web ce va aparea la incarcarea ei cu un program de navigare

Page 7: Limbajul HTML

3.2. Parametrii marcajului <BODY>…</BODY>

Parametrul bgcolor - se poate stabili prin valoarea lui culoarea fundalului paginii; valoarea acestuia va fi numele din limba engleza al culorii, incadrat intre ghilimele sau codul culorii precedat de semnul # incadrat de ghilimele.

Exemplu: <body bgcolor=“blue”> continutul paginii web</body>

<body bgcolor=“#0000FF”> continutul paginii web</body>

Parametrul background –se poate utiliza pentru fundalul unei pagini o imagine a carei adresa este specificata ca valoare a acestiu parametru.

<body background=URL>...</body>,

unde URL este un sir de caractere ce reprezinta adresa imaginii ce va fi utilizata de navigator ca fundal pentru pagina Web.

Parametrul TEXT -stabileste culoarea textului din pagina Web, culoarea poate fi specificata prin nume sau prin modelul RGB prezentat.

Parametrul LINK / Parametrul VLINK / Parametrul ALINK -stabileste culoarea cu care vor fi scrise in text legaturile nevizitate /vizitate / in curs de vizitare; culoarea poate fi specificata prin nume sau prin modelul RGB prezentat.

3. HTML de baza

Culori date prin nume Culori exprimate prin valoare RGB Culori sigure Internet

Page 8: Limbajul HTML

2. Editarea si vizualizarea unui document HTMLFISA NR. 1

Sarcini de lucru:

1.Lansati in executie editorul de texte Notepad si introduceti urmatorul text:

“Pe lânga plopii fara sot Adesea am trecut; Ma cunosteau vecinii totii – Tu nu m-ai cunoscut.”

Mihai Eminescu-PE LANGA PLOPII FARA SOT...

2. Salvati documentul cu numele eminescu.html .

3. Vizualizati cu navigatorul Inernet Explorer, pagina WEB creata.

Page 9: Limbajul HTML

Sarcini de lucru:

1. Lansati in executie editorul de texte Notepad si creati, utilizand structura unui document HTML, o pagina Web personala care sa constituie o carte de vizita” pentru cei ce doresc sa va cunoasca prin intermediul Internetului.

2. Utilizati parametrii marcajului <body>…</body>pentru stabilirea fundalului si culorii textului cu valorile pe care le considerati de cuviinta.

3. Stabiliti la inceputul textului o formula de salut pentru cei care viziteaza pagina.

4.Incheiati textul din pagina cu adresa de e-mail la care puteti primi eventualele mesaje.

5. Salvati documentul cu numele exercitiu1.html

6. Vizualizati pagina creata cu navigatorul Internet Explorer.

1.Analizati urmatorul document HTML; notati-l in caiete.

2.Vizualizati pagina creata cu navigatorul Internet Explorer.

Page 10: Limbajul HTML

SUBIECTE PROPUSE PENTRU ORA VIITOARE:

3.3. Formatrea paragrafelor

3.4. Formatarea font-urilor

3.5. Linii de delimitare si comentarii

Page 11: Limbajul HTML

In 2001, a aparut browserul Opera, deocamdatã putin folosit. Unii folosesc Lynx care, fiind un browser negrafic, nu recunoaste imaginile, ceea ce duce la o încarcare mult mai rapida a textului. Informatii suplimentare despre browsere gasiti la adresa www.browserwatch.com Orice browser prezinta, în partea de sus, o fereastra îngusta în care se tasteaza adresa paginii web cautate. Un exemplu de adresa ar fi: http://www.geocities.com sau http://www.geocities.com/dioan12/index.html Dupa tastarea adresei si apasarea tastei "Enter", browserul dvs. îi trimite serverului geocities.com cererea de a i se furniza o pagina web. In cazul a, serverul trimite pagina sa proprie. In cazul b, trimite pagina index.html a sitului dioan12 pe care îl gazduieste gratuit. In cazul b, ar fi trimis fisierul index.html si daca tastam doar: http://www.geocities.com/dioan12 deoarece, în mod implicit, la accesarea unui sit se încarcã fisierul index.html. ( Nota: Nestiind ce sistem de operare e instalat pe serverul pe care intentioneaza sa faca upload-ul sitului propriu, unii webdesigneri salveaza fisierul index.html si ca index.htm, default.htm, default.html. Dupa care fac upload-ul tuturor acestor fisiere, urmând ca serverul sa furnizeze clientilor, la accesarea sitului, unul dintre aceste 4 fisiere. Daca sunteti începator, nu va bateti însa prea tare capul cu aceste chestiuni.)