Jump to content
Sign in to follow this  
Tzunyo

Tutoriale html - Tabele - Elemente de baza in html

Recommended Posts

In continutul site-ului vostru veti include tabele, fie ca e vorba de clasificarea unor item-uri, fie ca veti utiliza aceste tabele pentru a particulariza interfata paginii ( intreaga pagina sa fie defapt un tabel cu mai multe celule avand fundaluri diferite si continut corespunzator ).
Pentru a incepe sa folositi tabelele trebuie sa stici ca tagul necesar este <table></table>.
Un simplu tabel arata cam asa :

<table border="1">
  <tr>
    <td>randul 1, celula 1</td>
    <td>randul 1, celula 2</td>
  </tr>
  <tr>
    <td>randul 2, celula 1</td>
    <td>randul 2, celula 2</td>
  </tr>
</table>

 
Bun, <table> deschide tabelul. <tr> anunta inceperea unui rand. <td> introduce o noua celula( si continutul acesteia ).
Tagurile de inchidere sunt </tr> pentru randuri, respectiv </td> pentru celule.
Tabelul va fi terminat prin </table>
Table headers.
In cadrul tabelelor pot fi introduse capete de lista ca sa zicem asa. Exemplu:

<table border="1">
  <tr>
    <th>Header 1</th>
    <th>Header 2</th>
  </tr>
  <tr>
    <td>randul 1, celula 1</td>
    <td>randul 1, celula 2</td>
  </tr>
  <tr>
    <td>randul 2, celula 1</td>
    <td>randul 2, celula 2</td>
  </tr>
</table>

 
Pentru a vedea rezultatele acestor exemple copiati codul intr-un text editor ( gen notepad si dati save as documentWeb.html )
Dupa cum ati observat am folosit atributul border="1" pentru a evidentia marginile tabelului.
Tagul <table> suporta atributele html globale cum ar fi class, id, style, etc. Atributele globale le gasiti aici : 

http://www.w3schools.com/html5/html5_ref_globalattributes.asp

Folosind tagurile id sau class va veti usura munca in procesul de stilare a paginii web.
Daca aveti intrebari va rog sa mi le adresati mai jos, lasand un comentariu.
© Tzunyo

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...