Versmed – Hai sahabat versmed. Pernah ngak kalian lihat kotak- kotak yang digunakan di blog untuk menyajikan suatu data? Tabel dapat gunakan untuk menyajikan data dalam bentuk kolom dan baris. Sebuah tabel biasanya mempunyai judul, baris untuk mengisi informasi dan sel untuk setiap itemnya. Selain itu tabel juga dapat di isikan dengan daftar item, form, paragraph, gambar, audio, video dan lain sebagainya. Nah disini admin versmed, pengen kasi tahu cara mudahnya buat dan menyisipkan tabel HTML di blog yang sobat miliki. Dibaca dengan teliti ya….(y)

Tabel HTML pada dasarnya tersusun atas tag <table> dan tag penutupnya </table>. Tag ini selalu berpasangan, jadi jika suatu HTML tabel tidak ditutup dengan tag penutup tabel </table>, maka tabel yang anda inginkan tidak akan bisa ditampilkan… ha ha ha…. kasian…. =D

Cara Membuat Tabel HTML

Di dalam tag tabel juga terdapat tag- tag yang dipergunakan untuk menyusun tabel, antara lain:

Tag <tr> dan </tr> : Tag ini selalu perpasangan, jika salah satu tag tidak dituliskan, maka tampilan tidak akan bisa terlihat. Tag ini digunakan untuk menyusun baris pada tabel.
Tag <td> dan </td> : Tag ini digunakan untuk menyusun kolom pada tabel. Tag ini dalam penggunaannya juga harus berpasangan.

Nah struktur penulisan tag tabel HTML adalah sebagai berikut

<table border="1" align="center">
      <tr>
           <td>Informasi Versi Media | Versmed</td>
         <td>Blog Informasi Versi Media | Versmed</td>
      </tr>
      <tr>
         <td>Keterangan dari baris tabel 1</td>
           <td>Keterangan dari baris tabel 2</td>
      </tr>
</table>

Hasil dari kode HTML diatas ialah sebagai berikut :

Informasi Versi Media \| Versmed	Blog Informasi Versi Media \| Versmed
Keterangan dari baris tabel 1	Keterangan dari baris tabel 2

NOTICE : Tag kolom <td> harus diletakkan di dalam tag baris<tr>

Dari contoh di atas admin Cuma mau kasi tahu untuk membuat table dengan 2 baris <tr> dan 2 kolom <td>. Tampilan ini hanyalah tampilan standart, anda bisa menghiasnya dengan atribut untuk mempercantik tampilannya. Misalkan :

align=”center” : maka tabel akan ditampilkan di tengah- tengah halaman.
bgcolor=”red” : untuk memberikan warna background merah di dalam tabel yang di inginkan. Warna merah bisa anda ganti dengan warna lainnya atau juga bisa mengguanakan warna RGB ( Red Green Blue ).
colspan : untuk menggabungkan 2 kolom
rowspan : untuk menggabungkan 2 baris

Dalam penggunaannya anda bisa melihat kode html di bawah ini (y)

<table width="400px" border="1" align="center>
      <tr>

    <th colspan="2" bgcolor="red"><font color="white">Blog Informasi Versi Media | Versmed</font></th>
     </tr>
     <tr>
          <td>Keterangan dari baris tabel 1</td>
          <td>Keterangan dari baris tabel 2</td>
     </tr>
     <tr>
          <td>Informasi 1</td>
          <td>Informasi 2</td>
     </tr>
     <tr>
<th colspan="2" bgcolor="red"><font color="white">Designed by versmed</font></th>
     </tr>
</table>

Hasil dari tampilan diatas ialah sebagai berikut :

Blog Informasi Versi Media \| Versmed
Keterangan dari baris tabel 1	Keterangan dari baris tabel 2
Informasi 1	Informasi 2
Designed by versmed

Mudah aja kan buat tabel dengan menggunakan HTML. Sekarang tinggal kalian aplikasikan menurut kebutuhan kalian. Kalian bisa menggunakan notepad biasa, notepad ++, ms.word untuk membuat kode HTML nya. Untuk cara penyisipan tag HTML ini kedalam post blog kamu, mudah aja kok. Baca tutorialnya dibawah ini:

Baca artikel lainnya tentang spesifikasi dan harga smartphone terbaru disini

Cara menyisipkan kode HTML tabel ke dalam Blog kamu

Dalam penyisipan tabel ini, admin akan kasi tahu untuk menyisipkannya di post blogger aja. Karena admin ngak tahu pake wordpress…. he he he he…. :D =D

Pertama kali kalian masuk ke post di blog kamu….
Setelah layout untuk membuat posting tampil, sekarang kalian klik pada HTML.
Kamu tentukan tempat yang sesuai dan perlu untuk disisipkan tabel ini. Setelah itu kalian copy pastekan kode HTML yang kalian buat tadi. Trus klik PUBLISH.
Dan lihat hasilnya diblog kamu

Semoga kalian sukses ya... :)