Sunteți pe pagina 1din 4

Lucrare nr. 1 Tema: Iniţiere în HTML Structura generală a unui document.

Ce inseamna HTML ?
HTML e prescurtarea de la HyperText Markup Language. HTML e un limbaj pentru calculator, care, daca-i folosit corect,
poate crea o pagina web.

Codurile HTML
Aceste coduri sunt folosite in fiecare document HTML pe care-l creezi. Aceste coduri definesc structura documentului.
Aceste coduri sunt folosite intodeauna in pereche.

Codul HTML Ce face


<HTML> si </HTML> Defineste documentu' ca document HTML
<HEAD> si </HEAD> Include informatii despre document
<TITLE> si </TITLE> Indica titlul documentului
<BODY> si </BODY> Incadreaza toate elementele din document

Codul <HTML>
Cele doua coduri <HTML> incadreaza totul in document. Daca ele lipsesc documentu' se vede ca simplu text.
Codul <HEAD>
Fara cele doua coduri <HEAD> ,unele browsere nu pot identifica documentul.
Codul <TITLE>
Intre cele doua coduri <TITLE>intra titlul paginii tale . Fa-ti titlul cat mai descriptiv, pentru a putea fi identifcat usor.
Codul<BODY>
Intre cele doua coduri <BODY> sunt icluse datele care vor aparea pe pagina.
Acest cod <BODY> este cel care va afisa culorile pe care le-ati setat voi. Setarile de culori pentru pagina sunt:

Setarea Ce face
BGCOLOR="culoare" Culoarea fundalului documentului
TEXT="culoare" Culoarea textului
LINK="culoare" Culoarea legaturii inainte de click
VLINK="culoare" Culoarea legaturii vizitate
ALINK="culoare" Culoarea legaturii in timpul click-ului

Culorile dupa nume si codul RGB


Putem folosi codul (RGB) sau, numele culori in engleza .
Iata cateva exemple:

  black   lightblue

  white   pink

  silver   red

  gray   darkred

  green   orange

  darkgreen   darkorange

  lightgreen   lightyellow

  grey   yellow

  lime   violet

  teal   darkviolet

  olive   navy

  aqua   blue

Iata o setare a culorilor folosind atat codul RGB cat si numele culorilor:

<HTML>
<HEAD>
<TITLE> Pagina mea</TITLE>
</HEAD>
<BODY BGCOLOR="#000000" TEXT="#00FF00" LINK="yellow" VLINK="orange" ALINK="red">
</BODY>
</HTML>
LUCRARE NR. 2 TEMA: TEXTE ŞI
CULORI

Folosirea codurilor HTML simple


Codurile de baza HTML iti dau posibilitatea de a pune text si imagini in document.
Coduri pentru text
Sunt doua modalitati de a shimba marimea textului in document.
Cu codurile Headings .
Acestea sunt folosite pentru a shimba marimea titlurilor. Sunt folosite in pereche.

Aici aveti exemple.

HTML Tag Effect


<H1> si </H1> Heading 1
<H2> si </H2> Heading 2
<H3> si </H3> Heading 3
<H4> si </H4> Heading 4
<H5> si </H5> Heading 5
<H6> si </H6> Heading 6

Pentru text avem altceva. Codurile font. Folosite iarasi pereche.

Codul HTML Efectul


<FONT SIZE="1"> si </FONT> Size 1

<FONT SIZE="2"> si </FONT> Size 2


<FONT SIZE="3"> si </FONT> Size 3
<FONT SIZE="4"> si </FONT> Size 4
<FONT SIZE="5"> si </FONT> Size 5
<FONT SIZE="6"> si </FONT> Size 6
<FONT SIZE="7"> si </FONT>
Size 7
Paragraf si spatii in text
Spatiul in text poate fi facut in doua feluri :
Primul cod este <BR> Efectul este spatiu pana la linia urmatoare.
Poate fi folosit si pentru imagini.
Poate fi scris repetat de cate ori doriti pentru a intrerupe randul de text.
Al doilea cod e <P> Acesta incepe textul intr-un nou paragraf sau lasa spatiu intre linii.

Sa-i punem culoare textului

Ca sa adaugi culoare textului vom pune un nou cod in FONT.


Iata doua exemple primul folosind numele culorii.

<FONT SIZE="4" COLOR="blue" >

Al doilea folosind codurile RGB.

<FONT SIZE="4" COLOR="#3333FF" >


Iata documentul nostru. Cu un Heading si text colorat. Folosind si spatiu intre text si paragraf

<HTML>
<HEAD>
<TITLE>exemplul 1</TITLE>
</HEAD>
<BODY BGCOLOR="#000000" TEXT="#00FF00" LINK="yellow" VLINK="orange" ALINK="red">
<H1>Bine ati venit</H1>
<P>
<FONT SIZE="3" COLOR="white" >
Sunteti pe pagina mea <BR>
pe care am facut-o acum. <BR>
Abia am inceput <BR>
da-i destul de misto.
</FONT>
</BODY>
</HTML>

LUCRARE NR. 3 TEMA: FONTURI

Lucrul cu FONT

Iata niste coduri care sa shimbe forma textului vostru in pagina Web Page.
Le puteti folosi pentru efecte simmple. Dar si pentru efecte mai complexe. Se folosesc pereche.

Exemplu :

Sa folosim Bold, Underline si Italic impreuna:

<FONT SIZE="3" COLOR="darkgreen">


<b> <i> <u> Pagina mea </u> </i> </b>
</FONT>

Ne iese:

Pagina mea
Iata 13 setari de font uzuale:

Codul Denumirea Functioneaza in


HTML 2.0
<b> si </b> Bold
Webtv
HTML 2.0
<i> si </i> Italic
Webtv
HTML 2.0
<tt> si </tt> Typewriter
Webtv
HTML 2.0
<u> si </u> Underline
Webtv
HTML 2.0
<sub> si </sub> Subscript
Webtv
Superscript HTML 2.0
<sup> si </sup>
Webtv
<blink> si </blink> Blink Netscape
<big> si </big> Big HTML 3.2
<small> si </small> Small HTML 3.2
HTML 2.0
<strike> si </strike> Strike
Webtv
<strong> si </stong> Strong HTML 2.0
Webtv
Internet Explorer
<marquee> si </marquee> Marquee
Webtv

Sa-i dam niste efecte font documentului nostru HTML.

<HTML>
<HEAD>
<TITLE> exemplul 2</TITLE>
</HEAD>
<BODY BGCOLOR="#000000" TEXT="#00FF00" LINK="yellow" VLINK="orange" ALINK="red">
<H1> <i> <u> Bine ati venit</u> </i> </H1>
<P>
<FONT SIZE="3" COLOR="white">
<b> <tt> Sunteti pe pagina mea<BR>
pe care am facut-o acum. <BR>
Abia am inceput <BR>
da-i destul de misto. </tt> </b>
<FONT>
</BODY>
</HTML>

LUCRARE NR. 4 TEMA: AŞEZAREA


TEXTULUI ÎN PAGINĂ

Alinierea textului

Hai sa asezam textul unde vrea muschiu' nostru , Textul este asezat automat in stanga .
Dar putem sa-l aliniem si noi ori in dreapta ori in centru.

Setarea Efectul
ALIGN="CENTER" Centreaza textu' intre cele doua margini
ALIGN="RIGHT" Aliniaza textul la dreapta pagini

Sa punem aceste setari si pe documentul nostru HTML.

<HTML>
<HEAD>
<TITLE> exemplul 3</TITLE>
</HEAD>
<BODY BGCOLOR="#000000" TEXT="#00FF00" LINK="yellow" VLINK="orange" ALINK="red">
<H1 ALIGN=CENTER>
<i> <u> Bine ati venit</u> </i> </H1>
<P ALIGN=RIGHT>
<FONT SIZE="3" COLOR="white">
<b> <tt> Sunteti pe pagina mea<BR>
pe care am facut-o acum. <BR>
Abia am inceput <BR>
da-i destul de misto. </tt> </b>
<FONT>
</BODY>
</HTML>