Tabel
Tag <table> digunakan untuk membuat tabel dalam dokumen HTML, bagian pokok dari tabel adalah sel.
Elemen tabel terdiri dari :
Mendefinisikan tabel :
<table border="n" cellpadding="n" cellspacing="n">
……….
</table>
Attribute Tabel
Border : garis pada tabel ; n=0, 1, 2, .. dst
Cellpadding : spasi antar sel dan border
Cellspacing : jarak antar sel
WIDTH : Menentukan lebar tabel
HEIGHT : Menentukan tinggi tabel
BGCOLOR : Menentukan background tabel
BACKGROUND : Menentukan gambar yang digunakan untuk background tabel
Mendefinisikan judul tabel, dalam keadaan default posisi ditengah bagian paling atas tabel.
<caption align=”…”> … </caption>
Menspesifikasikan sebuah baris.
<tr align=”…”> … </tr>
Mendefinisikan sel header
<th> … </th>
Mendefinisikan sebuah sel data
<td> … </td>
Atribut table yang lain :
Align = {left | center | right } --> alignment horizontal untuk sel
Valign = {top | middle | bottom } --> alignment vertical dalam sel
Colspan = n --> menggabungkan beberapa kolom
Rowspan = n --> menggabungkan beberapa baris
Contoh :
<html>
<head>
<title>Penggunaan Tabel Dalam HTML</title>
</head>
<body>
<table border="1" width="70%" >
<caption>BIODATA SISWA</caption>
<tr>
<th width="15%">Nama</th>
<th width="16%">Alamat</th>
<th width="35%" colspan="3" align="center">Telepon</th>
</tr>
<tr>
<td width="15%">Endar Nirmala</td>
<td width="16%"> Jl. Rasamala 3, Jakarta</td>
<td width="13%" align="center">021 - 5678910</td>
<td width="13%" align="center">0812285104</td>
<td width="13%" align="center">021 - 56788901</td>
</tr>
<tr>
<td width="15%">Wirastuti Wiraguna</td>
<td width="16%"> Jl. Permata 5, Jakarta</td>
<td width="13%" align="center">021 - 76456982</td>
<td width="13%" align="center">08183457298</td>
<td width="13%" align="center">021 - 66543881</td>
</tr>
</table>
<p> </p>
<table border="1" width="70%" >
<caption>BIODATA SISWA</caption>
<tr>
<th width="15%">Nama</th>
<th width="16%">Alamat</th>
<th width="9%" align="center">Telepon</th>
</tr>
<tr>
<td width="15%" rowspan="3">Angga Kusuma</td>
<td width="16%" rowspan="3"> Jl. Karbela 2, Jakarta</td>
<td width="13%" align="center">021 - 55667788</td>
</tr>
<tr>
<td width="13%" align="center">08131445689</td>
</tr>
<tr>
<td width="13%" align="center">021 - 56788901</td>
</tr>
<tr>
<td width="15%" rowspan="3">Wirastuti Wiraguna</td>
<td width="16%" rowspan="3"> Jl. Permata 5, Jakarta</td>
<td width="13%" align="center">021 - 76456982</td>
</tr>
<tr>
<td width="13%" align="center">08183457298</td>
</tr>
<tr>
<td width="13%" align="center">021 - 66543881</td>
</tr>
</table>
</body>
</html>
Hasilnya :
BIODATA SISWA
| Nama | Alamat | Telepon |
| Endar Nirmala | Jl. Rasamala 3, Jakarta | 021 - 5678910 | 0812285104 | 021 - 56788901 |
| Wirastuti Wiraguna | Jl. Permata 5, Jakarta | 021 - 76456982 | 08183457298 | 021 - 66543881 |
BIODATA SISWA
| Nama | Alamat | Telepon |
| Angga Kusuma | Jl. Karbela 2, Jakarta | 021 - 55667788 |
| 08131445689 |
| 021 - 56788901 |
| Wirastuti Wiraguna | Jl. Permata 5, Jakarta | 021 - 76456982 |
| 08183457298 |
| 021 - 66543881 |
0 komentar:
Posting Komentar