html prezentare

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:

• … - 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: Textul va fi aliniat la dreapta in pagina

• <H>…<H> - realizeaza nivelurile de titlu in documentul html

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

B. Formatarea la nivel de caracterFormatarea caracterelor poate fi realizata prin utilizarea etichetei :

.. 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: Acest text este scris cu dimensiunea 2, culoarea rosie si font Arial

C. Efecte aplicate asupra textelorEfectele introduse asupra textului sunt intoduse prin etichetele de mai jos:

-… textul va fi scris ingrosat

-… textul va fi scris subliniat

- <S>…</S> textul va fi scris taiat

- … textul va fi scris inclinat

-<BIG>..</BIG> textul va fi scris mai mare

- .. textul va fi scris mai mic

- <STRIKE>..</STRIKE> textul va fi scris taiat

-- Exemplu: Acest text are efecte!!!

Exemplul nr. 1Exemplul nr. 1

Exemplul nr. 2Exemplul nr. 2

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.

Exemplu

Sursa programului

Subiect propus:

Creati propria voastra pagina Web cu formatarile pe care le doriti voi.

html prezentare

Documents