Asezare in pagina folosind tag-ul <table>
- Trebuie sa stiti ca marea majoritate a site-urilor web folosesc tabelele pentru incadrarea textului si a imaginilor in pagina si nu numai pt incadrarea tuturor elementelor unei pagini.
Mai jos veti vedea cum se realizeaza Layout-ul unei pagini web folosind tag-ul <table></table> - Care este rolul tabelelor intr-o pagina web?
-Pai cu ajutorul tabelelor noi putem imparti o pagina web in mai multe coloane in care putem pune ce elemnte dorim:text,imagini,filme etc. . -Pagina pe care o cititi acum are doua coloane si anume una este cea cu link-urile din partea stinga iar in alta se afla textul cu descrierea folosirii tabelelor.
-Daca nu precizati in tag-ul <table></table> dimensiunea conturului tabelei border(eng.) ca optiune initiala(default -eng.) border-ul este de dimensiunea 1
-Puteti sa introduceti cit text vreti ,textul se incadreaza in border-ul celulei(ca tabela este impartita in celule), iar daca scrieti mai mult text tabela s emareste in functie de continut.
-Un exemplu de tabela il vedeti aici: Prima mea tabela in html folosind tag-ul <table></table> iar mai jos vedeti codul html:(trebuie sa precizez ca tabela are doua celule)
-Dupa cum vedeti am scris intre tag-urile <table></table> <tr><td></td><td></td></tr> ; ce inseamna asta? <tr></tr>spune browser-ului ca trebuie sa afiseze un rind nou de celule care se scriu <td></td>.Ori de cite ori doriti sa introduceti un rind nou de celule trebuie sa incepeti cu<tr> scrieti in code cite celule vreti; daca doriti doua trebuie sa scrieti asa:<td>textul care vreti sa-l puneti</td><td>un alt text care vreti sa-l puneti</td> iar mai apoi trebuie sa inchideti tag-ul </tr>.
<html>
<head>
<title>Prima mea tabela in html</title>
</head>
<body>
<table>
<tr>
<td>Aceasta este prima mea tabela care contine doua
celule una fiind cea care contine acest text pe
care-l cititi acum </td>
<td>Iar aceasta parte contine un alt text; aceasta
este partea un punem un alt text care va fi afisat
in partea dreapta dupa cum vedeti...
NOTA:observati ca tabela are un contur(border-.eng) de
dimensiunea unu pe care am dorit eu s-o aiba ; valoarea
iniziala a conturului tabelei in cazul in care nu
precizati valoarea lui
in cadrul tag-ului <table> este 0 ,adica nu se va vedea
nici un contur ;daca doriti sa aveti o tabela
cu contur(border-.eng) trebuie sa dati dimensiunea
conturului 1 lucru care se scrie in felul urmator
<table border="1">.Border este un atribut
al tag-ului <table> si poate avea mai multe valori
incepind de la 0; binenteles toate valori intregi
pozitive.
</td>
</tr>
</table>
</body>
</html> - Un alt exemplu de tabela dar cu fundal de culoare diferit il vedeti aici:Prima mea tabela colorata in html folosind tag-ul <table></tabela> si atributul bgcolor al tag-ului <td></td>
-Aici puteti vedea codul si cum am scris:
<html>
<head>
<title>Prima mea tabela in html</title>
</head>
<body>
<table>
<tr>
<td>Aceasta este prima mea tabela care contine
doua celule una fiind cea care contine acest text
pe care-l cititi acum
</td>
<td>Iar aceasta parte contine un alt text; aceasta
este partea un punem un alt text care va fi afisat
in partea dreapta dupa cum vedeti...
NOTA:observati ca tabela are un contur(border-.eng)
de dimensiunea unu pe care am dorit eu s-o aiba ;
valoarea iniziala a conturului tabelei in cazul
in care nu precizati valoarea lui in cadrul
tag-ului <table> este 0 ,adica nu se va vedea nici
un contur ;daca doriti sa aveti o tabela cu contur
(border-.eng)
trebuie sa dati dimensiunea conturului 1 lucru care se
scrie in felul urmator<table border="1">.Border este
un atribut al tag-ului <table> si poate avea mai multe
valori incepind de la 0; binenteles toate valori intregi
pozitive. Observati ca aceasta celula are culoare gri
deoarece am introdus in tag-ul <td> atributul bgcolor
adica am scris i felul urmator<td bgcolor="#999999">.
#999999 reprezinta codul hex al culorii respective.
NOTA:atributul bgcolor binenteles poate avea valori
din cele mai diverse in functie de dorintele voaste.
Noi va recomandam sa folositi culorile sigure sau
web safe-.eng pe care le vom preciza
in alta sectiune deoarece acele culori le pot vizualiza
corect toti utilizatorii de internet.</td>
</tr>
</table>
</body>
</html>
Link-ul autorului:
www.avasilcaidaniel.com/
Comentarii
Voteaza acest articol!
Trimite un comentariu!
