Judul pada tabel sangat lah penting, karena apa? bagaimana kita mengetahui tabel itu namanya apa dan maksudnya untuk apa, apabila kita tidak memberikan judul pada tabel tersebut. Bisa untuk mempertegas juga bahwa tabel tersebut memiliki nama identitas, serta mempermudah apabila tabel tersebut banyak lebih dari 2 misalkan, nah dengan caption ini kita bisa mudah mencari tabel yang dimaksudkan itu yang mana. bahwa caption/judul ini mencakup dari kesuluruhan isi tabel tersebut. Penempatannya pun harus pada element tabel dan memiliki attribut align yang memiliki nilai "top" atau "bottom". Dimana apabila top digunakan membuat caption/judul diatas tabel sedangkan pada bottom maka posisi caption/judul dibawah tabel.
Mungkin kita sering melihat ini di modul - modul pelajaran sekolah ya. Tetapi kenapa harus ada dalam berbasis website. Mungkin saja ada pertanyaan begini "Dimana saja kita bisa menemukan tabel dengan caption dalam berbasis web?" misal coba kita cari website edukasi, artinya tentang pembelajaran dimulai dari modul sampai ke latihan, kita bisa menemukan fungsi caption ini apabila di website tersebut ada tabel nya. Dan kita juga bisa menggunakan ini apabila kita mau membuat website edukasi atau hanya sekedar catatan harian mengenai pelajaran disekolah yang diharuskan membuat tabel berikut disertakan judulnya atau caption ini.
Baik untuk latihan sekarang saya akan mengambil dari latihan tabel sebelumnya yaitu mengenai Membuat tabel sederhana HTML dan akan ada sedikit sentuhan - sentuhan warna pada tabel tersebut. Oke kalo begitu akan langsung saja dimulai secara teknis nya. Let's Go . . .
Screenshot
- Web Editor (Notepad ++, DW, dll)
- Web Browser (Mozilla Firefox, Chrome, dll)
Cara Pasang
Ketikan sintax/kode dibawah ini
<html>
<head>
<title>Membuat Caption Tabel</title>
</head>
<body>
<table border="1" bgcolor="cyan" cellpadding="4" cellspacing="0">
<caption align="top"><b>Tabel 1.1</b></caption>
<tr>
<th>No.</th>
<th>Nama</th>
<th>Alamat</th>
</tr>
<tr>
<td>1.</td>
<td>Dina</td>
<td>Majalengka</td>
</tr>
<tr>
<td>2.</td>
<td>Lili</td>
<td>Cirebon</td>
</tr>
</table>
</body>
</html>
Simpan dengan ekstensi *.html atau dengan nama caption.html
No comments:
Post a Comment