Hallo, ketemu lagi dengan saya di BibipBoy .
Pada postingan kali ini saya akan membagikan tutorial mengenai
Cara Membuat Tabel Dengan HTML.
Dalam pembuatan website, tabel biasanya digunakan untuk menampilkan data yang terstruktur, misalnya data siswa, daftar barang, jadwal, dan lain sebagainya.
HTML sendiri sudah menyediakan beberapa tag khusus untuk membuat tabel dengan mudah.
Tenang saja, tutorial ini cocok untuk pemula yang baru belajar HTML 😄
Yuk langsung simak pembahasannya di bawah ini 👇
Tag Dasar Tabel HTML
Untuk membuat tabel di HTML, setidaknya kita membutuhkan 3 tag utama berikut:
1
Tag
<table>
digunakan untuk membuat atau memulai tabel.
2
Tag
<tr>
merupakan singkatan dari
table row,
digunakan untuk membuat baris pada tabel.
3
Tag
<td>
merupakan singkatan dari
table data,
digunakan untuk mengisi data di dalam tabel.
Contoh Program Tabel HTML
Agar lebih mudah dipahami, berikut contoh penggunaan tag tabel pada HTML:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Tag Tabel</title>
</head>
<body>
<h1>Belajar Tag Tabel</h1>
<table border="1">
<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>
</table>
</body>
</html>
Penjelasan Kode Program
1
Tag
<table border="1">
digunakan untuk membuat tabel dengan garis border.
2
Tag
<tr>
digunakan untuk membuat baris baru pada tabel.
3
Tag
<td>
digunakan untuk mengisi data pada setiap kolom tabel.
4
Setiap kombinasi
<tr>
dan
<td>
akan membentuk struktur tabel yang rapi.
Hasil Tampilan Tabel
| Baris 1, Kolom 1 | Baris 1, Kolom 2 | Baris 1, Kolom 3 |
| Baris 2, Kolom 1 | Baris 2, Kolom 2 | Baris 2, Kolom 3 |
| Baris 3, Kolom 1 | Baris 3, Kolom 2 | Baris 3, Kolom 3 |
| Baris 4, Kolom 1 | Baris 4, Kolom 2 | Baris 4, Kolom 3 |
Tips Tambahan
1
Gunakan CSS agar tampilan tabel menjadi lebih menarik.
2
Tambahkan
cellpadding
agar isi tabel tidak terlalu rapat.
3
Gunakan tabel hanya untuk data terstruktur, bukan untuk mengatur layout website.
Nah, itulah tutorial mengenai
Cara Membuat Tabel Dengan HTML
.
Gimana? Mudah banget, kan? 😄
Dengan memahami tag tabel HTML, kalian bisa membuat tampilan data website menjadi lebih rapi dan terstruktur.
Kalian juga bisa mengembangkan tabel ini menggunakan CSS agar tampilannya semakin keren dan modern.
Semoga tutorial dari BibipBoy ini bisa berguna dan bermanfaat bagi para pembaca.
Selamat mencoba dan semoga berhasil 🚀
Terima kasih dan sampai jumpa di artikel berikutnya ✨
Gimana? Mudah banget, kan? 😄
Dengan memahami tag tabel HTML, kalian bisa membuat tampilan data website menjadi lebih rapi dan terstruktur.
Kalian juga bisa mengembangkan tabel ini menggunakan CSS agar tampilannya semakin keren dan modern.
Semoga tutorial dari BibipBoy ini bisa berguna dan bermanfaat bagi para pembaca.
Selamat mencoba dan semoga berhasil 🚀
Terima kasih dan sampai jumpa di artikel berikutnya ✨
.png)
No comments:
Post a Comment