Minggu, 28 Februari 2010

HTML (Table)

    Table digunakan untuk menyajikan data dalam bentuk kolom dan baris. Umumnya setiap kolom menunjukkan data yang sejenis. dan setiap baris terdiri atas kolom-kolom yang menunjukkan kelompok data dalam satu kesatuan.

    Table juga merupakan elemen yang paling berguna bila ingin mengubah tampilan informasi menjadi lebih tertata rapi, sebab jika tidak menggunakan table dalam dokumen HTML akan sulit sekali menata letak tulisan, gambar maupun objek yang lainnya.

    Struktur penulisan tag table:

                  <table>                                 
                   <caption>Judul Table</caption>         
                   <tr>                                   
                    <th>Header dari kolom atau baris</th> 
                    <td>Isi Cell</td>                     
                   </tr>                                  
                  </table>                                


Tag-Tag Pembentuk Table
Elemen Penjelasan
<table>...</table>  Mendefinisikan sebuah table dalam HTML
<caption>...</caption>  Mendefinisikan judul table. Posisi default dari 
  judul adalah di tengah pada bagian atas table.
<tr>...</tr>   Mendefinisikan sebuah baris dalam table.
<th>...</th>   Mendefinisikan sel header table. Secara  
  default teks dalam sel ini ditebalkan dan
  ditampilkan di tengah.
<td>...</td>   Mendefinisikan sebuah sel dalam table.
  Secara default teks dalam sel ini ditampilkan 
  rata kiri dan di tengah secara vertikal.
  Sel data  table dapat mengandung atribut
  untuk mendefinisikan karakteristik dari sel dan
  isinya.

Atribut-Atribut Tag
<table>
width="..."  Mengatur lebar dari table. Dapat berupa pixel atau 
  persen.
border="..."  Mengatur ukuran bingkai table.
bordercolor="..."   Mengatur warna bingkai table.
align="..."   Mengatur letak table {left | center | right}.
bgcolor="..."   Mengatur warna background table.
cellspacing="..."   Mengatur jarak antarsel.
cellpadding="..."   Mengatur jarak bingkai dengan isi.
<caption>
align="..."   Mengatur letak judul table {top | bottom}.
<tr>
align="..."  Mengatur perataan isi sel secara horizontal
  {left | center | right}.
valign="..."  Mengatur perataan isi sel secara vertikal
  {top | middle | bottom}.
bgcolor="..."   Mengatur warna background table.
<th> & <td>
rowspan="..."   Menggabungkan beberapa baris menjadi satu.
colspan="..."   Menggabungkan beberapa kolom menjadi satu.

NB: 
Bagian table yang dapat diisi informasi berupa tulisan, gambar, atau objek lainnya termasuk membuat table lagi (tentu saja dengan aturan penulisan table yang benar) yaitu di dalam tag <th> atau <td>.

1 komentar:

Unknown mengatakan...

Terima kasih telah membaca tulisan saya kali ini.
Mudah-mudahan dapat berguna bagi Anda, baik sebagai bahan pembelajaran ataupun sebagai reverensi.

Kritik atau saran dari Anda akan sangat berguna untuk perbaikan kedepannya.
Jika ada, langsung saja tinggalkan komentar Anda disini.


Sekian,
Salam WEB mastah! :)

Posting Komentar

 

All About Web Programming © 2010