Slefuirea: mai multe despre tabele
Alinierea textului in interiorul celulelor
Poti alinia textul central, la stanga sau la dreapta, sus, jos sau la mijloc.
<TD align="aliniere">
Cazuri posibile:
<TD align="center"> - centru
<TD align="left"> - stanga
<TD align="right"> - dreapta
<TD align="bottom"> - jos
<TD align="top"> - sus
<TD align="middle"> - la mijloc
Culoarea fundalului
Pentru a asocia o culoare personalizata pentru fundalul unui tabel sau chiar
pentru o celula individuala, folositi atributul BGCOLOR="#rrggbb" la eticheta
<TABLE> sau la eticheta <TD>
<TABLE BGCOLOR="#CCCCCC">
Imagine de fundal
Poti seta imaginea de funal, in locul unei culori de fundal pentru un tabel sau
o celula. Se introduce atributul BACKGROUND in interiorul etichetei
<TABLE> sau <TD> si setezi atributul egal cu numele fisierului
imagine pe care doresti sa-l folosesti, ca in exemplu:
<TABLE BACKGROUND="table.gif">
Marimea marginii
Pentru a modifica grosimea marginii tabelului, poti asocia o valoare atributului
BORDER al etichetei <TABLE>.
<TABLE BORDER="5">
Latimea si inaltimea tabelului
Daca ai nevoie ca tabelul tau sa aibe o anumita latime, foloseste atributul
WIDTH pentru eticheta <TABLE>.Poti specifica fie o marime in pixeli, fie
un procentaj din latimea ferestrei disponibile.
<TABLE WIDTH="75%">tabelul ocupa 75% din latimea ferestrei
sau
<TABLE WIDTH="500">
Pentru determinarea inaltimii tabelului, se foloseste atributul HEIGHT. Utilizarea cea mai obisnuita este setarea
atributului la 100% astfel incat tabelul sa se intinda intotdeauna pe inaltimea
ferestrei browserului.
Latimea unei celule
Poti specifica, de asemenea latimea unei celule individuale adaugand atributul
WIDTH la eticheta <TD>.
<TD WIDTH="50%"> celula ocupa 50% din latimea tabelului.
Cantitatea de spatiu dintre celule
Implicit, browserul lasa un spatiu de doi pixeli intre celule (pe verticala sau
pe orizontala). Pentru â mari acest spatiu, folosesti atributul
CELLSPACING pentru eticheta <TABLE>
<TABLE CELLSPACING="10"> mareste spatiul dintre celule la 10
Cantitatea de spatiu intre continutul unei celule si marginea acesteia
Browserul lasa un spatiu de un pixel intre continutul celulei si marginea
celulei. Pentru â da datelor din tabel mai mult spatiu sa respire, foloseste
atributul CELLPADING
al etichetei <TABLE>.
<TABLE CELLPADING="10"> spune browserului sa rezerve un spatu de umplere
de 10 pixeli deasupra, dedesubtul, la stanga si la dreapta continutului din
fiecare celula
Extinderea textului sau imaginii pe mai multe randuri sau coloane
Pana acum, datele introduse de noi au ocupat o singura celula. Dar daca
vreau sa ocupe doua celule? Sau trei?
Sa
incepem cu intinderea pe mai multe coloane.
Pentru a face acest lucru, trebuie sa interpui atributul COLSPAN
(column span = intinderea coloanei) intre etichetele <TD>
<TD COLSPAN="coloane">
Coloanele reprezinta numarul de coloane pe care doresti sa se intinda celula.
Iata un exemplu:
<HTML>
<HEAD>
<TITILE> despre colspan</TITLE>
</HEAD>
<BODY>
<TABLE BORDER="1">
<TR>
<TD COLSPAN="2">
Acum ne intindem pe doua coloane
</TD>
<TD>
e o coloana obisnuita
</TD>
</TR>
</TABLE>
</BODY>
</HTML>
Extinderea pe randuri multiple este
asemanatoare, cu exceptia faptului ca inlocuiesti atributul COLSPAN cu ROWSPAN
in etichetele <TD>.
Iata un exemplu care arata o celula
intinsa pe doua randuri:
caseta de dialog. Cand cititorul apasa pe butonul de validare, datele din
formular sunt transmise catre programul specificat de atributul ACTION al
etichetei <FORM>.
Cel mai simplu format pentru butonul de validare:
<INPUT TYPE="SUBMIT" VALLUE="eticheta">
"eticheta" reprezinta textul care apare pe buton.
In poza de mai sus, cuvantul este "save".
Iata si un exemplu:
<HTML>
<HEAD>
<TITLE>buton</TITLE>
</HEAD>
<BODY>
<FORM ACTION=www.cursurigratuite.ro/formular.php METHOD="POST">
<INPUT TYPE="SUBMIT" VALUE="save">
</FORM>
</BODY>
</HTML>
Butonul de submit drept imagine
In loc sa folosesti o comanda plictisitoare pentru validarea unui formular ai
putea fi tentat sa inviti utilizatorul sa apese pe o imagine.
<INPUT TYPE="IMAGE" SRC="go.gif">
Butonul Reset
Un buton de anulare sterge toate datele din campurile formularului si
reintroduce toate valorile implicite pe care le-ai specificat in campuri.
Iata eticheta pentru butonul de anulare:
<INPUT TYPE="RESET">
sau personalizata:
<INPUT TYPE="RESET" VALUE="s-o luam de la inceput">
Casetele de text
Pentru introducerea textelor simple, cum ar fi numele persoanei sau masina
favorita, foloseste casetele de text (text boxes). Acestea sunt simple
dreptunghiuri in care cititorul introduce ce doreste.
Formatul de baza pentru o caseta de
text:
<INPUT TYPE="TEXT" NAME="nume camp">
|
