18 April 2011

Membuat Tabel HTML

Tabel digunakan untuk menyajikan data dalam bentuk kolom dan baris. Umumnya setiap kolom menunjukkan data yang sejenis, dan setiap baris yang terdiri atas kolom-kolom menunjukkan kelompok data dalam satu kesatuan. Sebuah tabel mempunyai judul, tempat anda menjelaskan kolom/baris yang dilibatkan, baris untuk informasi, dan sel untuk setiap itemnya. Pada tabel berikut, kolom pertama berisi informasi header, setiap baris menjelaskan sebuah tag tabel HTML,
dan setiap sel berisi sebuah pasangan tag atau penjelasan dari fungsi tag.

Berikut contoh sederhana dari penggunaan tag table HTML 
<!-coba_tabel.html->
<html>
<body>
<p>sebuah tabel dimulai dengan sebuah tag table.
Setiap baris dimulai dengan sebuah tag tr.
Setiap data dimulai denga sebuah tag td. </p>
<h4>Satu kolom</h4>
<table border="1">
<tr>
  <td>100</td>
</tr>
</table>
<h4>satu baris dan tiga kolom</h4>
<table border="1">
<tr>
  <td>Amir</td>
  <td>Badu</td>
  <td>Cici</td>
</tr>
</table>
<h4>Dua baris dan tiga kolom</h4>
<table border="1">
<tr>
  <td>Amir</td>
  <td>Badu</td>
  <td>Cici</td>
</tr>
<tr>
<td>Amir</td>
  <td>Badu</td>
  <td>Cici</td>
</tr>
</table>
</body>
</html>

Contoh di atas mendemontrasikan bagaimana membuat tabel dalam sebuah dokumen HTML.

Elemen-elemen tabel

Elemen Penjelasan

<table>...</table>



<caption>...</caption>







<tr>...</tr>




<th>...</th>



<td>...</td>






Mendefinisikan sebuah table dalam HTML. Jika atribut border dituliskan, maka browser akan menampilkan tabel dengan border

Mendefinisikan tulisan untuk judul tabel. Posisi default dari judul adalah ditengah pada bagian paling atas tabel atribut align="bottom" dapat digunakan untuk menempatkan judul pada bagian bawah tabel.
Catatan: judul dapat diberi tag apa saja.

Menspesifikasikan sebuah baris tabel dalam tabel. Anda dapat mendefinisikan atribut untuk seluruh baris: align (left, center, right). dan valign (top, middle, bottom).

Mendefinisikan sel header tabel. Secara default teks dalam sel ini ditebalkan dan ditampilkan di tengah.

Mendefinisikan sebuah sel tabel. Secara default teks dalam sel ini ditampilka rata kiri, dan di tengah secara vertikal. Sel data tabel dapat berisi atribut untuk mendefinisikan karakteristik dari sel dan isinya. 

Atribut table

Elemen Penjelasan

align={left|center|right}
valign={top|middle|bottom}

colspan=n
rowspan=n
nowrap

Alignment horizontal untuk sel
Definisi alignment vertikal dalam sel
Jumlah n kolom sel diperlebar
Jumlah n baris sel diperlebar
Matikan wrapping dalam sel


Catatan: Atribut yang didefinisikan dalam <th>...</th> atau <td>...</td> akan menggantikan alignment default yang didefinisikan dalam <tr>...</tr>

Salah satu manfaat dari penggunaan tabel adalah untuk merapikan postingan pada blog seperti pada postingan  saya kali ini. Demikian sekilas tentang tabel HTML semoga berguna. Salam.

Artikel Terkait Lainnya



1 komentar:

Unknown mengatakan...

Very much informative, helpful and useful post.

Watch Movies Online

Posting Komentar

PrevPage NextPage home