Cara Membuat Tabel Menggunakan HTML Gampang
 |
| kredit: kindpng |
Halo semua, pada artikel kali ini, saya akan memberikan tutorial bagaimana cara membaut tabel yang baik dan benar menggunakan HTML. Nah, artikel ini nantinya akan sangat berguna bagi kamu yang baru banget mempelajari pemrograman web.
Supaya kamu berhasil membuat tabel menggunakan HTML, kita ketahui dulu beberapa tag tabel yang ada di HTML. Adapun beberapa tag beserta fungsinya yaitu sebagai berikut.
- <table> berfungsi untuk membuat tabel.
- <tr> berfungsi untuk membuat baris pada tabel, tr merupakan singkatan dari table row.
- <td> berfungsi untuk menginput data pada tabel, td merupakan singkatan dari table data.
Nah, setelah memahami masing-masing fungsi dari tag tersebut, mari kita coba membuat satu tabel sederhana menggunakan HTML. Oh iya, di sini saya akan menggunakan Notepad sebagai text editornya ya.
1. Buka Notepad
 |
| dokumen pribadi |
Nah, yang pertama kita buka dulu text editor yang akan kita gunakan. Kalau di sini, saya membuatnya dengan menggunakan Notepad karena lebih mudah dan merupakan software bawaan. Cara mencarinya tinggal tekan tombol windows, lalu ketik Notepad dan buka Notepadnya.
2. Buat code tabel HTML
 |
| dokumen pribadi |
Selanjutnya, kamu tinggal buat kode dari tabelnya. Nah, untuk kode atau codingnya, kamu bisa copy dan paste code di bawah ini agar lebih cepat dan efisien waktu.
<!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>
Namun saya tetap sarankan untuk mempelajari masing-masing tag yang sudah saya beritahu tadi.
3. Jalankan tabel/lihat hasil
 |
| dokumen pribadi |
Yang terakhir kita lihat hasil kode di atas, apakah sudah benar atau belum. Nah, cara untuk kita bisa melihat HTML tabel tersebut adalah dengan save terlebih dahulu file tersebut dengan ekstensi .html. Lalu buka browser kita dan tambahkan file tersebut. Untuk merefresh kodenya, kamu cukup tekan F5.
Nah, itu dia tadi tutorial mudah membuat tabel HTML sederhana. Jika ada pertanyaan, bisa diajukan di kolom komentar