1.Notiuni introductive
2.Editarea si vizualizarea unui document HTML
3.Crearea unui document
4.Salvarea unui document ca document HTML
5.Deschiderea unui document HTML
6.Structura unui document HTML
7.Parametri marcajului <BODY>…</BODY>
8. Formatarea textului dintr-o pagina web
A. Formatarea la nivel de paragraf
B. Formatarea la nivel de caracter
C.Efecte aplicate asupra textelor
HTML e acronimul de la HyperText Markup Language, care e numele unui limbaj de marcare.
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 elemente sau tag-uri. 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
1.Notiuni introductive
2. Editarea si vizualizarea unui document HTML
Editarea 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
Crearea si salvarea unui document HTML3. Crearea unui document
File New sau folosind tastele Alt+F, apoi tasta N
4. 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
5. Deschiderea 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
6. Structura documenului HTML 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
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>Culoarea=Denumirea in lb. englezaNegru=BlackAlb=WhiteRosu=RedVerde=GreenAlbastru=BlueGalben=YellowViolet=PurpleVerde marin=AquaVernil=LimeArgintiu=SilverCastaniu=MaroonGri=GrayMasliniu=OliveAlbastru Marin=Navy
7. Parametri marcajului HTML
A. Formatarea la nivel de paragraf
B. Formatarea la nivel de caracter
C. Efecte aplicate asupra textelor
D. Exemple
8.Formatarea textului dintr-o pagina WEB
A. Formatarea la nivel de paragrafFormatarea unui paragraf se realizeaza utilizand urmatoarele etichete:
• <P>…</P> - specifica faptul ca un text reprezinta un nou paragraf al documentului html
Atributul etichetei:
- align : specifica tipul de aliniere al textului in pagina
Valorile pe care le poate lua sunt left, right, center.
Exemplu: <p align=“right”>Textul va fi aliniat la dreapta in pagina</p>
• <H>…<H> - realizeaza nivelurile de titlu in documentul html
• <BR> - specifica trecerea la o noua linie
• <CENTER>..</CENTER> - permite centrarea rapida a textului.
OBS: Acest tag poate fi folosit in special la alinierea titlurilor in document si este asemanator cu eticheta <p align=“center”>
B. Formatarea la nivel de caracterFormatarea caracterelor poate fi realizata prin utilizarea etichetei :
<FONT>..</FONT> Atributele etichetei sunt:
- size =“valoare” (specifica dimensiunea caracterelor)
OBS: Valoare primita de acest atribut poate fi :
- un numar natural cuprins intre 1 si 7
- relativa la dimensiunea curenta a caracterelor (size va primi valoarea +n daca caracterele vor fi cu n marimi mai mari sau valoare –n daca caracterele vor fi cu n mai mici ).
-face=“nume_font” (specifica numele fontului aplicat textului)
-color=“nume_culoare” (specifica culoarea cu care vor fi scise caracterele)
Exemplu: <FONT face=“Arial”, size=“2”, color=“red”>Acest text este scris cu dimensiunea 2, culoarea rosie si font Arial</FONT>
C. Efecte aplicate asupra textelorEfectele introduse asupra textului sunt intoduse prin etichetele de mai jos:
-<B>…</B> textul va fi scris ingrosat
-<U>…</U> textul va fi scris subliniat
- <S>…</S> textul va fi scris taiat
- <I>…</I> textul va fi scris inclinat
-<BIG>..</BIG> textul va fi scris mai mare
- <SMALL>..</SMALL> textul va fi scris mai mic
- <STRIKE>..</STRIKE> textul va fi scris taiat
-- Exemplu: <B><I>Acest text are efecte!!!</B></I>
Fisa de lucru Clasa a IX-a
Crearea pagini WEB
Realizati o pagina WEB care sa respecte urmatoarele formatari:lansati programul notepad iar pentru ca browser-ul sa poata afisa un fisier HTML salvati-l cu numele vostru.html.alegeti o culoare pentru fundalul paginii.pagina sa contina un titlu centrat de o culoare si dimensiune aleasa de voi ex: Bine ai venit in pagina mea pagina sa contina datele voastre personale cu urmatoarele formatari:
nume, prenume, scoala, data nasterii, sa aiba fonturi, dimensiuni, culori diferite alese de voivizualizati cu navigatorul Internet Explorer, pagina WEB creata.