Limbajul HTML
description
Transcript of Limbajul HTML
1.Noţiuni introductive
2.Editarea şi vizualizarea unui document HTML
3.HTML de bază
3.1. Structura unui document HTML
3.2. Parametrii marcajului <BODY>…</BODY>
Colegiul Tehnic Energetic Constanţa
HTML e acronimul de la HyperText Markup Language, care este numele unui limbaj de marcare.
A fost conceput în 1989 de Tim Berners-Lee, licenţiat la Oxford, pe atunci fizician. Fiind şi expert în software, Berners-Lee e acum director al World Wide Web Consortium (pe scurt, W3C), adică al organizaţiei care coordonează dezvoltarea web-ului (în principal, prin impunerea de standarde pentru limbaje etc.). Fiind un limbaj de marcare, HTML nu utilizează instrucţiuni (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>
Pagina anterioara Pagina urmatoare
1.NOTIUNI INTRODUCTIVE
Pagina anterioara Pagina urmatoare
1.NOŢIUNI INTRODUCTIVE
O pagină web poate conţine:
Ce este un browser?
Care sunt cele mai populare browsere?
• text • imagini • fişiere audio • fişiere video
2. Editarea şi vizualizarea unui document HTML
Editarea unui document HTML
Pentru editarea unui document Html se pot folosi procesoarele de text Notepad, WordPad sau un editor specializat în crearea paginilor Web.
Lansarea în execuţie a procesorului de texte Notepad:
Start Programs Accessories Notepad
2. EDITAREA ŞI VIZUALIZAREA UNUI DOCUMENT HTML
CREAREA UNUI
DOCUMENT
• File→ New sau• folosind tastele Alt+F, apoi tasta N
SALVAREA UNUI
DOCUMENT CA FIŞIER
HTML
• File→Save sau• folosind tastele Alt+F, apoi tasta S• În fereastra Save parcurgeti următoarele
etape:• Pasul 1: din lista ascunsă Save In alegeţi
directorul în care salvaţi documentul• Pasul2: scrieţi în zona de editare File name
numele pe care doriţi să îl daţi documentului adăugând extensia html sau htm
• Pasul3: acţionaţi declanşatorul Save
2. EDITAREA ŞI VIZUALIZAREA UNUI DOCUMENT HTML
DESCHIDEREA UNUI
DOCUMENT HTML
• File→Open sau Alt+F după care tasta O• În fereastra Open se parcurg următorii paşi:• Pasul 1: Din lista ascunsă Save as Type alegeţi
tipul documentului• Pasul 2: Din lista ascunsă Look in alegeţi
directorul în care se gaseşte documentul pe care doriţi să-l deschideţi
• Pasul 3: În căsuţa de dialog File name scrieţi numele documentului pe care doriţi să-l deschideţi sau selectatţi cu mouse-ul documentul respectiv
• Pasul 4: Acţionaţi declanşatorul Open
3. HTML de bază3.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 delimitează de următoarele marcaje:• Marcajul de specificare a documentului de tip
hipertext• Marcajul de specificare a capului documentului
de tip hipertext delimiteză informaţiile referitoare la crearea paginii
Web, informaţii ce nu vor apărea la vizualizarea paginii respective cu un program de navigare
marcajul <TITLE>..</TITLE>delimitează un nume pe care dorim să-l dăm paginii ce urmează s-o realizăm şi care va apărea în bara de stare a programului de navigare
• Marcajul de specificare a corpului documentului de tip hipertext
Acest marcaj cuprinde conţinutul paginii Web ce va apărea la încărcarea ei cu un program de navigare
3.2. Parametrii marcajului <BODY>…</BODY>
Parametrul bgcolor - se poate stabili prin valoarea lui culoarea fundalului paginii; valoarea acestuia va fi numele din limba engleză al culorii, încadrat între ghilimele sau codul culorii precedat de semnul # încadrat de ghilimele.
Exemplu: <body bgcolor=“blue”> continutul paginii web</body>
<body bgcolor=“#0000FF”> continutul paginii web</body>
3. HTML de bază
Culori date prin
nume
Culori exprimate
prin valoare RGB
Culori sigure
Internet
Informaţii suplimentare
culori-nume.htm culori-rgb.htm rgb-sigure.htm
3.2. Parametrii marcajului <BODY>…</BODY>
Parametrul background –se poate utiliza pentru ca fundalul unei pagini să conţină o imagine a cărei adresă este specificată ca valoare a acestiu parametru.
<body background=URL>...</body>,
unde URL este un şir de caractere ce reprezintă adresa imaginii ce va fi utilizată de navigator ca fundal pentru pagina Web.
Parametrul TEXT - stabileşte culoarea textului din pagina Web, culoarea poate fi specificatş prin nume sau prin modelul RGB prezentat.
Parametrul LINK / Parametrul VLINK / Parametrul ALINK - stabileşte culoarea cu care vor fi scrise în text legăturile nevizitate /vizitate / în curs de vizitare; culoarea poate fi specificată prin nume sau prin modelul RGB prezentat.
3. HTML de bază
2. EDITAREA ŞI VIZUALIZAREA UNUI FIŞIER HTML
FIŞĂ DE LUCRU 1
Sarcini de lucru:
1.Lansaţi în execuţie editorul de texte
Notepad şi introduceţi următorul text:
2. Salvaţi documentul cu numele
eminescu.html.
3. Vizualizaţi cu navigatorul Internet
Explorer, pagina WEB creată.
“PE LÂNGĂ PLOPII FĂRĂ SOŢ ADESEA AM TRECUT; MĂ CUNOŞTEAU VECINII TOŢI – TU NU M-AI CUNOSCUT.”
MIHAI EMINESCU
-PE LÂNGĂ PLOPII FĂRĂ SOŢ...
2. EDITAREA ŞI VIZUALIZAREA UNUI FIŞIER HTML
1.Analizati următorul document HTML
2.Vizualizaţi pagina creată cu navigatorul Internet Explorer.
EXEMPLU.txt
PAGINA.HTML
2. EDITAREA ŞI VIZUALIZAREA UNUI FIŞIER HTML
1. Lansaţi în execuţie editorul de texte Notepad şi creaţi, utilizând
structura unui document HTML, o pagină Web personală care să
constituie „o carte de vizită” pentru cei ce doresc să vă cunoască prin intermediul
Internetului.
2. Utilizaţi parametrii marcajului <body>…</body> pentru stabilirea fundalului şi culorii textului cu valorile pe
care le consideraţi de cuviinţă.
3. Stabiliţi la începutul textului o
formulă de salut pentru cei care
vizitează pagina.
4.Încheiati textul din pagină cu adresa de e-mail la care puteţi
primi eventualele mesaje.
5. Salvaţi documentul cu numele
exercitiu1.html
6. Vizualizaţi pagina creată cu
navigatorul Internet Explorer.
FIŞĂ DE LUCRU 2
SUBIECTE PROPUSE PENTRU
ORA VIITOARE:
Formatarea paragrafelor
Formatarea fonturilor
Linii de delimitare şi comentarii