Pada postingan kemren kita telah membuat bagaimana Belajar Html Membuat Tabel bagian 2 dan Belajar Html Membuat Tabel. Kali ini Anda akan mencoba pengembangan lebih jauh dari tag table. Mulailah mencoba kode-kode di bawah ini, kemudian silakan bereksperimen mengubah sendiri aribut maupun nilainya untuk melihat efek perubahannya. Adapun pada Postingan Kali ini akan membuat Cell Padding, Cell Spacing, Menambahkan latar belakang ke tabel, Menambahkan latar belakang ke sel tabel, Mengatur isi sel tabel, dan Atribut frame pada tabel.
Cell Padding
<html>
<body>
<h4>Tanpa cellpadding:</h4>
<table border=”1″>
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
<h4>Dengan cellpadding:</h4>
<table border=”1″ cellpadding=”10″>
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
</body>
</html>
Cell Spacing
<html>
<body>
<h4>Tanpa cellspacing:</h4>
<table border=”1″>
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
<h4>Dengan cellspacing:</h4>
<table border=”1″
cellspacing=”10″>
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
</body>
</html>
Menambahkan latar belakang ke tabel
<html>
<body>
<h4>Dengan warna latar belakang:</h4>
<table border=”1″ bgcolor=”red”>
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
<h4>Dengan latar belakang gambar:</h4>
<table border=”1″ background=”../bg.jpg”>
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
</body>
</html>
Menambahkan latar belakang ke sel tabel
<html>
<body>
<h4>Latar belakang pada sel:</h4>
<table border=”1″>
<tr>
<td bgcolor=”red”>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td background=”../bg.jpg”>
Kedua</td>
<td>Baris</td>
</tr>
</table>
</body>
</html>
Mengatur isi sel tabel
<html>
<body>
<table width=”400″ border=”1″>
<tr>
<th align=”left”>Dana yang dikeluarkan pada bulan….</th>
<th align=”right”>Januari</th>
<th align=”right”>Februari</th>
</tr>
<tr>
<td align=”left”>Pakaian</td>
<td align=”right”>Rp. 241.000,00</td>
<td align=”right”>Rp. 50.000,00</td>
</tr>
<tr>
<td align=”left”>Make-Up</td>
<td align=”right”>Rp. 30.000,00</td>
<td align=”right”>Rp. 44.500,00</td>
</tr>
<tr>
<td align=”left”>Makanan</td>
<td align=”right”>Rp. 730.000,00</td>
<td align=”right”>Rp. 650.000,00</td>
</tr>
<tr>
<th align=”left”>Jumlah</th>
<th align=”right”>Rp. 1001.500,00</th>
<th align=”right”>Rp. 744.650,00</th>
</tr>
</table>
</body>
</html>
Atribut frame pada tabel
<html>
<body>
<p>
Bila Anda tidak melihat adanya frame di sekeliling tabel pada contoh ini, berarti browser Anda terlalu lama, atau mungkin tidak mendukung frame dalam tabel.
</p>
<h4>With frame=”border”:</h4>
<table frame=”border”>
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
<h4>Dengan frame=”box”:</h4>
<table frame=”box”>
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
<h4>Dengan frame=”void”:</h4>
<table frame=”void”>
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
<h4>Dengan frame=”above”:</h4>
<table frame=”above”>
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
<h4>Dengan frame=”below”:</h4>
<table frame=”below”>
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
<h4>Dengan frame=”hsides”:</h4>
<table frame=”hsides”>
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
<h4>Dengan frame=”vsides”:</h4>
<table frame=”vsides”>
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
<h4>Dengan frame=”lhs”:</h4>
<table frame=”lhs”>
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
<h4>Dengan frame=”rhs”:</h4>
<table frame=”rhs”>
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
</body>
</html>
Sehat Tanpa Obat 