Tabelele sunt elemente foarte utile pentru asezarea si prezentarea continutului intr-o pagina web.

1. Crearea de tabele

Pentru a crea tabele in paginile web se foloseste elementul <table> ... </table> , acesta incadreaza alte patru sub-elemente, care alcatuiesc structura tabelului.

Linia tabelului de obicei contine elementul pentru titlurile tabelului si elementul pentru coloanele tabelului.
In cadrul elementelor pentru titluri si coloanele tabelului se pot adauga si alte elemente HTML, cum ar fi cele pentru formatul textului, paragrafe, link-uri sau imagini
Mai jos puteti vedea un exemplu de cod HTML pentru crearea unui tabel:
<table border="1">
<tr>
    <th>titlu 1</th>
    <th>titlu 2</th>
</tr>
<tr>
    <td>linia 2- coloana 1</td>
    <td>linia 2- coloana 2</td>
</tr>
<tr>
    <td>linia 3- coloana 1</td>
    <td>linia 3- coloana 2</td>
</tr>
<tr>
    <td>linia 4- coloana 1</td>
    <td>linia 4- coloana 2</td>
</tr>
</table>
- In pagina web apare asa:
titlu 1 titlu 2
linia 2- coloana 1 linia 2- coloana 2
linia 3- coloana 1 linia 3- coloana 2
linia 4- coloana 1 linia 4- coloana 2

2. Atributele Tabelului


Sub-titlu tabelului
    - Sub-titlu tabelului "caption" permite specificarea unei linii de text care va aparea deasupra sau sub tabel, acest lucru este definit de atributul "align" care poate lua valorile: top (deasupra) bottom (jos)
Exemplu:
<table border="1" cellpadding="2">
<caption align="bottom">acesta este textul</caption>
<tr>
    <th>titlu 1</th>
    <th>titlu 2</th>
</tr>
<tr>
    <td>linia 2- coloana 1</td>
    <td>linia 2- coloana 2</td>
</tr>
</table>
- In pagina web apare asa:
acesta este textul
titlu 1 titlu 2
linia 2- coloana 1 linia 2- coloana 2

3. Atributele specifice elementelor pentru titlu si coloane


in urmatorul exemplu puteti vedea rezultatul folosirii atributelor: "colspan" "rowspan" si "bgcolor"
<table border="1" cellpadding="2">
<caption align="bottom">acesta este textul</caption>
<tr>
    <th>titlu 1</th>
    <th>titlu 2</th>
</tr>
<tr>
    <td colspan="2">linia 2- coloana 1</td>
</tr>
<tr>
    <td rowspan="2">linia 3- coloana 1</td>
    <td>linia 3- coloana 2</td>
</tr>
<tr>
    <td bgcolor="#adadff">linia 4- coloana 2 - colorat</td>
</tr>
</table>
- In pagina web apare asa:
acesta este textul
titlu 1 titlu 2
linia 2- coloana 1
linia 3- coloana 1 linia 3- coloana 2
linia 4- coloana 2 - colorat

Exersati singuri si alte exemple de tabele, cu mai multe randuri si coloane.

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Care tag HTML5 adauga o aplicatie externa (SWF, PDF) in pagina web?
<mark> <embed> <canvas>
<embed src="flash_game.swf" width="450" height="350" />
Ce pseudo-element adauga un anume stil la prima linie de text din element?
:first-letter :before :first-line
#id:first-line {
  font-weight: bold;
  color: blue;
}
Clic pe proprietatea obiectului window care preia sau seteaza adresa URL a paginii curente.
window.location window.self window.status
var url = window.location;
alert(url);
Indicati functia PHP care preia continutul unui fisier sau pagina si-l adauga intr-un sir.
fopen() file_put_contents() file_get_contents()
$homepage = file_get_contents("http://www.marplo.net/");
echo $homepage;
Care din urmatoarele perechi de numere sunt in ordine unul dupa altu?
seven - eight ten - six three - five
This fruit has seven or eight seeds.
- Acest fruct are sapte sau opt seminte.
Care din urmatoarele perechi de numere sunt in ordine unul dupa altu?
diez - seis siete - ocho tres - cinco
Esta fruta tiene siete u ocho semillas.
- Acest fruct are sapte sau opt seminte.
Lucrul cu Tabele

Last accessed pages

  1. Number Lines (623)
  2. Viitor simplu - Exercitii si teste incepatori (335)
  3. Cursuri si Tutoriale: Spaniola, Engleza, HTML, CSS, Php-Mysql, JavaScript, Ajax (3921)
  4. Notiuni fundamentale despre bazele de date SQL (514)
  5. Imperfect (52)

Popular pages this month

  1. Bubbles3 (3095)
  2. Gramatica limbii engleze - Prezentare Generala (2931)
  3. Prezentul simplu si continuu - Present Tense Simple and Continuous (2164)
  4. Butterfly Kyodai (2012)
  5. Trecutul simplu si continuu - Past Tense Simple and Continuous (1827)