Monday 31 July 2017

Membuat Tabel Dengan HTML Beserta Penjelasannya

Cara membuat tabel sederhana menggunakan html – Halo sobat TB! Apa kabar?? Dikesempatan kali ini, saya akan memberi tutorial tentang cara membuat tabel list menggunakan html.

Seperti yang pernah saya jelaskan pada artikel sebelumnya, HTML adalah kode pemrograman yang digunakan untuk membangun sebuah halaman website beserta isinya. Kali ini, saya akan mencoba membuat sebuah tabel yang berisi list atau daftar sederhana dengan HTML yang bisa kamu praktekan langsung.

Dalam membuat tabel dengan html, ada beberapa tag yang harus dipelajari seperti.


1. <table>...</table>
2. <tr>...</tr>
3. <th>...</th>
4. <td>...</td>

Kode <table></table> merupakan tag untuk mengawali dan mengakhiri pembuatan tabel.
Kode <tr></tr> (table row) digunakan untuk membuat baris baru pada data tabel.
Kode <th></th> (table heading) digunakan untuk membuat judul kolom
Kode <td></td> (table data) digunakan untuk membuat data atau kolom tabel.
Oke sekarang mari kita praktek membuat sebuah tabel..

<h2>Data Nilai Ulangan Matematika Kelas IX.E</h2>
<table> <!-- Tag Tabel Dimulai-->
<tr> <!-- Baris Judul Kolom-->
<th>No</th>
<th>Nama</th>
<th>Nilai</th>
</tr>
<!-- Baris Baru-->
<tr> <!-- Data Tabel-->
<td>1.</td>
<td>Abdul</td>
<td>87</td>
<tr>
<!-- Baris Baru-->
<tr>
<td>2.</td>
<td>Banu</td>
<td>66</td>
<tr>
<!-- Baris Baru-->
<tr>
<td>3.</td>
<td>Cintiya</td>
<td>97</td>
<tr>
<!-- Baris Baru-->
<tr>
<td>4.</td>
<td>Daniel</td>
<td>96</td>
<tr>
<!-- Baris Baru-->
<tr>
<td>5.</td>
<td>Edi</td>
<td>78</td>
<tr>
</table><!-- Tag Tabel Ditutup-->
Hasilnya: 


Itulah tadi penjelasan mengenai pembuatan tabel sederhana dengan html. Kamu juga bisa menambah kode css untuk mempercantik tabel yang telah dibuat sehingga lebih sedap dipandang.
Demikian artikel tentang cara membuat tabel dengan html ini, semoga bermanfaat! Terima Kasih!

1 komentar:

  1. This comment has been removed by a blog administrator.

    ReplyDelete

Hai, Mohon Komentar Yang Relevan Dan Tidak OOT!