Cara Membuat Tabel di HTML – Untuk menampilkan data, entah itu berasal dari database atau dari sumber lain, akan lebih terlihat rapih jika kita menggunakan tabel. Sekarang, kita akan membahas bagaimana cara membuat tabel di HTML. Dalam menampilkan data yang terstruktur atau tampilan dari database, kita biasanya akan membuatnya dalam bentuk tabel. HTML juga menyediakan tag <table> yang digunakan untuk menampilkan data dalam bentuk tabel.
Cara Membuat Tabel HTML dengan tag <table>, <tr>, dan <td>
Untuk membuat tabel di HTML, kita membutuhkan setidaknya 3 tag, yaitu tag <table>, tag <tr>, dan tag <td>:
- Tag <table> digunakan untuk membuat tabel.
- Tag <tr> adalah singkatan dari table row, digunakan untuk membuat baris dari tabel.
- Tag <td> adalah singkatan dari table data, digunakan untuk menginput data ke dalam tabel.
Supaya lebih jelas, kita akan langsung menggunakan contoh HTML nya:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Tag Table</title>
</head>
<body>
<h1>Belajar Tag Table</h1>
<table border="3">
<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>
<tr>
<td>Baris 3, Kolom 1</td>
<td>Baris 3, Kolom 2</td>
<td>Baris 3, Kolom 3</td>
</tr>
<tr>
<td>Baris 4, Kolom 1</td>
<td>Baris 4, Kolom 2</td>
<td>Baris 4, Kolom 3</td>
</tr>
<tr>
<td>Baris 5, Kolom 1</td>
<td>Baris 5, Kolom 2</td>
<td>Baris 5, Kolom 3</td>
</tr>
</table>
</body>
</html>
Perhatikan bahwa tag <table> kita memberikan atribut border. Atribut border digunakan untuk memberikan garis tepi dari tabel. Nilai ini dalam ukuran pixel. Border = 3, berarti kita menyuruh kepada web browser untuk memberikan nilai kepada tabel berupa garis tepi sebebas 3 pixel. Jika tidak ditambahkan, secara default tabel tidak memliki garis tepi.
Sampai disini kita sudah mempelajari beberapa tag HTML yang sering digunakan dalam pembuatan sebuah website. Untuk membuat halaman website yang panjang, terkadang perlu diberi komentar untuk memberikan seperti sebuah catatan atau mengenai fungsi dan tujuan kita membuatnya. Selanjutnya kita akan membahas cara membuat komentar di HTML.