Curs de realizare pagini Web folosind limbajul HTML

Capitolul V – Exemple de tabele

In continuare vom da doua exemple de tabele care pot fi incarcate si in fisierul index.html desxhis in Notepad:

<TABLE WIDTH=700 BORDER=0 CELLPADDING=5 CELLSPACING=5>
<TR>
<TD WIDTH=30% BGCOLOR=#006666 ALIGN=LEFT>
<FONT FACE=VERDANA,ARIAL SIZE=2 COLOR=#FFFFFF>
<B> Adresa: </B></FONT></TD>
<TD BGCOLOR=”#CCEEEE” ALIGN=LEFT>
<FONT FACE=VERDANA,ARIAL SIZE=2>
<I> Bulevardul Independentei nr. 0, Bloc 0, Ap 0, Sector 0, Bucuresti </I></FONT></TD>
</TR>
<TR>
<TD WIDTH=30% BGCOLOR=#006666 ALIGN=LEFT>
<FONT FACE=VERDANA,ARIAL SIZE=2 COLOR=#FFFFFF>
<B> Activitate: </B></FONT></TD>
<TD BGCOLOR=”#CCEEEE” ALIGN=LEFT>
<FONT FACE=VERDANA,ARIAL SIZE=2>
<I> ABC SRL va ofera o gama larga de produse si servicii necesare dezvoltarii activitatii societatii Dumneavoastra. Ne recomandam prin structura deosebita a ofertei noastre precum si prin politica de preturi practicata. </I></FONT></TD>
</TR>
</TABLE>


Exemplul de mai sus nu contine decat notiuni explicate deja in capitolele anterioare: este vorba de un tabel “clasic” cu lungime de 700 pixeli (WIDTH=700), fara cadru (BORDER=0) si cu spatiu de 5 pixeli atat intre casute (CELLSPACING=5) cat si intre cadru si informatia din casuta (CELLPADDING=5); tabelul are doua randuri (continute intre cele doua perechi de tag-uri <TR>…</TR>); fiecare rand contine cate doua casute:
- prima de lungime 30% din total (WIDTH=30%) cu culoarea fondului bleumarin (BGCOLOR=#006666) si textul aliniat la stanga. Textul din aceasta casuta este scris cu font Verdana de dimensiune 2 si culoare alba (FONT FACE=VERDANA,ARIAL SIZE=2 COLOR=#FFFFFF) si este ingrosat (B).
- a doua casuta cu fond bleu (BGCOLOR=#CCEEEE) si text aliniat de asemenea la stanga (ALIGN=LEFT). Contine text cu acelasi font Verdana de dimensiune 2, dar scris cu negru (implicit) si cu litere inclinate (I).

Poti copia exemplul de mai sus in fisierul tau index.html deschis in Notepad (pozitioneaza-l intre ultimul tag <BR> si tag-ul </BODY> de la sfarsitul fisierului).

Iti mai prezentam inca un tabel, ceva mai simplu:

<TABLE WIDTH=700 BORDER=1 CELLPADDING=5>
<TR><TD BGCOLOR=#CCEEEE>
<FONT FACE=VERDANA,ARIAL SIZE=2>
<B> NOU </B>
Incepand cu luna februarie societatea noastra aplica reduceri la produsele oferite de la 30% la 50%, in functie de cantitate. Va invitam sa ne apelati la telefon <B>000.0000</B> pentru informatii suplimentare. Va stam la dispozitie si prin <B>e-mail</B> cu o oferta completa de preturi. Puteti vizita si pagina societatii <B>XYZ</B> cu care colaboram indeaproape: apasati aici.
</TD></TR></TABLE>

Acest tabel are aceeasi lungime de 700 de pixeli (WIDTH=700), are si cadru (BORDER=1) si un spatiu de la cadru la textul din casute de 5 pixeli (CELLPADDING=5). Tabelul contine un singur rand si o singra casuta in acest rand. Casuta are fondul bleu (BGCOLOR=#CCEEEE).In interiorul casutei este un text scris cu font Verdana de dimensiune 2. Unele cuvinte din tabel sunt scrise cu bold (B).

Copiaza si acest exemplu in fisierul tau index.html deschis in Notepad (pozitioneaza-l intre tag-ul </TABLE> de jos si tag-ul </BODY> de la sfarsitul fisierului).

 

 

 

 

 

Leave a Reply