Tutorial Tabel HTML Part 3: Cara Membuat Judul Tabel HTML (tag caption)

Tutorial Tabel HTML Part 3: Cara Membuat Judul Tabel HTML (tag caption)


Halo Kawan-kawan,
Pada kesempatan kali ini, kita akan lebih medalami penggunaan tag caption yang biasa digunakan untuk membuat judul atau keterangan pada sebuah tabel HTML.


Penggunaan tag Caption


Tag Caption padadasarnya jarang digunakan namun sebenarnya sangat bemanfaat. Dengan mempelajari tag caption ini, kita mengetahui bahwa HTML telah menyediakan tag khusus untuk membuat judul tabel.

Langsung saja perhatikan kode berikut:
<!DOCTYPE html>
<html>
   <head>
       <title>Cara Penulisan Tag Caption Tabel HTML</title>
   </head>
<body>
<h2>Belajar Tag caption untuk Tabel HTML</h2>
<table border="1">
<caption>Contoh Caption Tabel</caption>
    <tr>
        <th>Judul 1</th>
        <th>Judul 2</th>
        <th>Judul 3</th>
    </tr>
    <tr>
        <td>Baris 1, Kolom 1</td>
        <td>Baris 1, Kolom 2</td>
        <td>Baris 1, Kolom 3</td>
    </tr>
    <tr>
        <td>Baris 2, Kolom 1</td>
        <td>Baris 2, Kolom 2</td>
        <td>Baris 2, Kolom 3</td>
    </tr>
</table>
</body>
</html>

Hasil Code:


Ketika dijalankan pada web browser, tag caption tersebut akan ditampilkan sebelum tabel, sehingga cocok untuk membuat keterangan dari tabel. Meskipun demikian banyak web developer menggunakan tag header untuk judul dari kolom, seperti tag h3 atau h4 untuk menggantikan penggunaan tag Caption karena bisa meningkatkan nilai judul tabel di dalam search engine (Search Engine Optimization).

Untuk tutorial tabel HTML selanjutnya, kita akan membahas tentang Cara Menggabungkan Sel Tabel (atribut rowspan dan colspan).

Belajar HTML Secara Lengkap Disini: