Home » Resurse Web Design » Primii pasi in HTML

 
 
 

Primii pasi in HTML

Orice document HTML incepe cu notatia <html> si se termina cu notatia </html>. Acestea se numesc in literatura de specialitate „tag-uri”.Prin conventie, toate informatiile HTML incep cu o paranteza unghiulara deschisa „<” si se termina cu o paranteza unghiulara inchisa „>”.

Tag-urile intre aceste paranteze transmit comenzi catre browser pentru a afisa pagina intr-un anumit mod.

Unele blocuri prezinta delimitator de sfarsit de bloc, in timp ce pentru alte blocuri acest delimitator este optional sau chiar interzis. Intre cele doua marcaje <html> si </html> vom introduce doua sectiuni:

– sectiunea de antet <head>…</head>

– corpul documentului <body>…</body>

Blocul <body>…</body> cuprinde continutul propriu-zis al paginii HTML, adica ceea ce va fi afisat in fereastra browser-ului.

O eticheta poate fi scrisa atat cu litere mici, cat si cu litere mari. Adica <HTML> = <HtmL> = <html>. Caracterele „spatiu” si „enter” (CR/LF) ce apar intre etichete sunt ignorate de catre browser.

Deci un prim document HTML ar fi de forma:

<html>
<head> </head>
<body> </body>
</html>

Vom adauga primele elemente la pagina noastra. In primul rand, titlul unei pagini se obtine cu marcajul <title>…</title> inserat in sectiunea <head>…</head>:

<title>Aceasta este prima mea pagina de Web</title>

In plus, in sectiunea <body>…</body> putem scrie texte cat dorim. Daca nu intalnim nici un marcaj ‘<’ sau ‘>’ atunci interpretorul HTML le va lua ca texte simple si le va afisa pe ecran. Sa vedem o noua versiune a paginii noastre:

<html>
<head>
<title>Aceasta este prima mea pagina de Web</title>
</head>
<body>

Bine ati venit in pagina mea de Web!

</body>
</html>

Continutul blocului <title>…</title> va aparea in bara de titlu a ferestrei browser-ului. Daca acest bloc lipseste intr-o pagina HTML, atunci in bara de titlu a ferstrei browser-ului va aparea numele fisierului.

Trecerea pe o linie noua se face la o comanda explicita, care trebuie sa apara in pagina html. Aceasta comanda este marcajul <br> (de la „line break” – intrerupere de linie).

Culoarea de fond

O culoare poate fi precizata in doua moduri:

– printr-un nume de culoare. Sunt disponibile cel putin 16 nume de culori: aqua, black, fuchsia, gray, green lime, maroon, navy, olive, purple, red, silver, teal, white si yellow.

– prin constructia „#rrggbb” unde r (red), g (green) sau b (blue) sunt cifre hexazecimale si pot lua valorile: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, a, A, b, B, c, C, d, D, e, E, f, F; se pot defini astfel 65536 de culori.

Culoarea unei pagini se precizeaza prin intermediul unui atribut al etichetei <body>. Culoarea fondului paginii Web se stabileste cu atributul bgcolor al etichetei <body>, de exemplu: <body bgcolor = culoare>. Urmatorul exemplu realizeaza o pagina cu fondul de culoare gri.

<html>
<head>
<title>culoare de fond </title>
</head>
<body bgcolor=gray>

O pagina Web cu fondul GRI!

</body>
</html>

Culoarea textului

Acest lucru se face prin intermediul atributului text al etichetei <body>, dupa sintaxa <body text=culoare>. In urmatorul exemplu textul are culorea rosie.

<html>
<head>
<title>culoarea textului </title>
</head>
<body text=red>

Un text de culoare rosie.

</body>
</html>

Stiluri pentru blocurile de text

Pentru ca un bloc de text sa apara in pagina evidentiat (cu caractere aldine), trebuie inclus intre delimitatorii <b>…</b> („bold”).

Pentru ca un text sa fie scris cu caractere mai mari cu o unitate decat cele curente acesta trebuie inclus intr-un bloc delimitat de etichetele <big>…</big>.

Pentru ca un text sa fie scris cu caractere mai mici cu o unitate decat cele curente acesta trebuie inclus intr-un bloc delimitat de etichetele <small>…</small>.

Pentru ca un text sa fie scris cu caraCtere cursive acesta trebuie inclus intr-un bloc delimitat de etichetele <i>…</i> („italic”).

Pentru a insera secvente de text aliniate ca indice (sub-script) sau ca exponent (super-script), aceste fragmente trebuie delimitate de etichetele <sub>…</sub>, respectiv <sup>…</sup>.

Pentru a insera un bloc de caractere subliniate se utilizeaza etichetele <u>…</u> („underline”).

Pentru a insera un bloc de caractere taiate se utilizeaza etichetele <strike>…</strike>.

In exemplul urmator vom utiliza toate etichetele mentionate anterior.

<html>
<head>
<title>Stiluri pentru blocuri de text </title>
</head>
<body>

<b>Text scris cu caractere ingrosate.</b>

<br> <big>Text cu caractere marite cu o unitate <big>mai mare<big> si mai mare<big> si mai mare.</big></big></big></big><br>

<small>Textul este scris cu caractere micsorate cu o unitate <small>mai mic.</small></small><br>

<i>Text scris cu caractere italice.</i>

<br> In aceasta linie <sup>sus</sup> este superscript iar <sub>jos</sub> este subscript.<br>

<strike>Aceasta linie este in intregime sectionata de o linie orizontala.</strike> <br>

In aceasta linie urmatorul cuvant este <u>subliniat</u>, iar cuvantul <s>strike</s> sectionat.

</body>
</html>

Eticheta:

Comentariile sunt inchise

Ne pare rau, dar nu poti lasa un comentariu pentru acest post.

Resurse web design