Home » » Membuat Tabel dengan Kode HTML

Membuat Tabel dengan Kode HTML

Diposting Oleh Bang Dayat ; Hari Jumat, 03 Agustus 2012 Jam 06.53

Kali ini Bang Dayat pengen sharing cara membuat tabel dengan kode HTML. Terus terang saja alasan posting ini buat referensi siapa tau nanti butuh scriptnya. Kemaren waktu update blog lainnya BD pengen buat tabel buat ngatur image agar tata letaknya teratur. Akhirnya ketemu juga caranya. Pembuatannya BD kerjakan secara manual.

Bagi sobat yang pengen buat tabel sederhana menggunakan html berikut langkahnya.

Untuk membuat tabel satu baris dua kolom maka skripnya adalah :
---------------------------------------------------------------------
<table border="1"><tbody> ==> kode awal


<tr><td>Nama</td><td>Nur Hidayatullah</td></tr> ==> diapit kode <tr></tr> merupakan baris
                   kolom 1                                kolom 2

</tbody></table> ==> kode akhir
---------------------------------------------------------------------

Untuk bentuk tabelnya adalah :

kolom1            kolom2
NamaNur Hidayatullah (baris 1)

Dari kode singkat dan hasil terjemahan kode html tentunya sobat dah sedikit paham maksud dari kode tersebut. Sehingga :
  • kode <table><tbody>......</tbody></table> adalah kode awal
  • kode <tr> . . . </tr> adalah kode tabel untuk membuat kolom atas/bawah
  • kode <td> . . . </td> untuk membuat baris kanan/kiri
  • urutan kodenya harus tepat, <tr> dulu baru <td>
  • Untuk menambah kolom atau baris diperbanyak saja kode <tr> . . . </tr> dan <td> . . . </td> nya

Contoh lain adalah kita ingin membuat tabel dengan  4 baris 3 kolom maka :

Script HTMLnya adalah :

<table border="1"><tbody>
<tr><td>Nama</td><td>Alamat</td><td>No. HP</td></tr>
<tr><td>Ari Dwikurnia</td><td>Gondomanan</td><td>085xxx</td></tr>
<tr><td>Zulham Zamrun</td><td>Gamping</td><td>0812xxx</td></tr>
<tr><td>Alya Sabila</td><td>Pakualaman</td><td>0877xxx</td></tr>
</tbody></table>

Bentuk tabelnya adalah :

NamaAlamatNo. HP
Ari DwikurniaGondomanan0853xxx
Zulham ZamrunGamping0812xxx
Alya SabilaPakualaman0877xxx

Bagaimana sobat? Mudahkan, itu adalah dasar pembuatan tabel. Untuk membuat tabel dengan pengembangan lainnya seperti mengubah border, warna, dan lain-lain akan dijelaskan lebih lanjut. Untuk sementara sekian dahulu postingan singkat membuat tabel sederhana dengan HTML semoga bermanfaat.
Berbagi dengan artikel ini :
Ditulis oleh : Bang Dayat
Description: Membuat Tabel dengan Kode HTML , Rating: 5
Reviewer: Bang Dayat, ItemReviewed: Membuat Tabel dengan Kode HTML

Artikel terkait tentang

Berlangganan Artikel BD
Masukkan Email Anda:

 
Support : Bang Dayat
Copyright © 2012-2017. Bang Dayat Blog's - All Rights Reserved

Proudly powered by Blogger