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.
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>
<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.
1 komentar:
Very much informative, helpful and useful post.
Watch Movies Online
Posting Komentar