Cara membuat dan posting tabel dengan kode HTML .

Malam, ............  salam sejahtera bagi kita semua.  Sengaja saya mengucapkan selamat malam karena pada saat membuat artikel ini kebetulan saya tidak bisa tidur.  Ya ...... mengapa tidak dimanfaatkan aja, lumayan kan dapat satu artikel.

Oke segitu aja sebagai pembukaan artikel ini, selanjutnya marilah kita membahas mengenai Cara membuat dan posting tabel dengan kode HTML .

Contoh tabel menggunakan kode HTML

Di sini sengaja saya tidak akan menerangkan definisi dari tabel, yang jelas dengan adanya tabel kita bisa menyajikan sebuah data dengan jelas dan ringkas, sebagai contoh seperti gambar di bawah.

Agar bisa lebih jelas dalam penyajian artikel ini saya sengaja memakai contoh sebuah tabel beserta bagiannya seperti gambar di bawah.

                                           Gambar 1.  Bagian dari tabel

Dari gambar 1. bisa dijelaskan sebagai berikut :

·        Kolom  : bagian vertikal (tegak) dari tabel

·        Baris     : bagian herisontal (mendatar) dari tabel

·        Cell       : bagian tabel yang nantinya akan diisi data

·        Border :  garis tepi semua cell dari tabel tersebut

Dari penjelasan di atas dapat dijelaskan bahwa tabel tersebut terdiri dari  2 baris,  3 kolom dan 6 cell.

Untuk membuat sebuah tabel diperlukan tag (kode) beserta atributnya.

Tag yang diperlukan untuk membuat tabel antara lain :

·        <table>...</table>   untuk memulai membuat tabel.

·        <tr> ... </tr> untuk membuat baris.

·        <td>... </td> untuk membuat kolom.

·        <caption> ... </caption> untuk membuat jusul tabel.

·        <th> ... </th> untuk membuat titel header (judul baris atau kolom).

Untuk posting tabel HTML pada halaman Entri anda harus pada posisi HTML jangan pada posisi Compose.

Supaya lebih jelas marilah kita lihat contoh tabel di bawah :

Kodenya :

<table border="2" width="100%"> 
<caption>DATA SISWA SD ATAS LANGIT</caption>
     <tr height="50">
     <th bgcolor="#FF99FF">Nama murid</th>
     <th bgcolor="#FF99FF">Nama wali murid</th>
     <th bgcolor="#FF99FF">Alamat</th>
     </tr>
              <tr height="50"
              <td>kolom 1 baris 2</td>
              <td>kolom 2 baris 2</td>
              <td>kolom 3 baris 2</td>
              </tr>
      <tr height="50"

      <td>kolom 1 baris 3</td>

      <td>kolom 2 baris 3</td>

      <td>kolom 3 baris 3</td>

      </tr>

</table>

Hasilnya :

DATA SISWA SD ATAS LANGIT

Nama murid	Nama wali murid	Alamat
kolom 1 baris 2	kolom 2 baris 2	kolom 3 baris 2
kolom 1 baris 3	kolom 2 baris 3	kolom 3 baris 3

Keterangan :

• Teks diantara <caption> dan </caption> serta antara <th> dan </th> secara otomatis akan rata tengah.
• border="2"       : menunjukan ketebalan border.
• width="100%" : menunjukan lebar tabel 100% (selebar halaman posting atau entri).
• height="50"       : menunjukan tinggi baris tabel sebesar 50px.

Mudah bukan cara membuat dan posting tabel dengan kode HTML ?

Kalau belum jelas silahkan tanya lewat komentar, tapi kalau sudah jelas silahkan baca kelanjutan dari artikel ini di  Cara menggabungkan dua cell atau lebih pada tabel HTML.
Selamat mencoba.