Cara Mudah Membuat Tabel Di Posting Blog

     
Tutorial Blog - Membuat tabel di postingan blog sebenarnya juga mudah. Namun juga dapat dibilang susah terutama bagi para pemula blogger. Saya sendiri juga pernah mengalami hal yang sama karena memang belum tahu dan belum pernah mencobanya.

Setelah mengetahui cara termudah membuat tabel di postingan blog. Akhirnya sampai sekarang tidak pernah mengalami kesulitan dalam membuatnya. Disini saya akan berbagi pengalaman untuk teman-teman blogger pemula.

Sebenarnya sudah banyak artikel yang membahas cara termudah dalam membuat tabel dipostingan blog. Tetapi tidak ada salahnya saya juga ikut andil dalam berbagi pengalaman. Membagikan ilmu yang bermanfaat adalah kewajiban penulis blog. Ilmu yang bermanfaat adalah ilmu yang dibagikan terhadap sesama.

Berikut ini kode HTML yang harus ditulis dalam membuat tabel. Perhatikan setiap kode dengan cermat dan teliti karena kode html sangat sensitif. Penulisan kode html jika tidak lengkap dan kurang dari satu karakter pun tidak akan berjalan dengan sempurna.

Kode HTML Untuk Membuat Tabel

Kode HTML ditulis dengan cara berpasangan misalnya kode <table> bepasangan dengan </table> yang diberi tanda penutup dengan garis miring.

Contoh :

<table>
  <tbody>
   <tr>
    <th>
        Kolom satu dibaris satu    </th>
    <th>
        Kolom dua dibaris satu    </th>
     <th>
        Kolom tiga dibaris satu    </th>
    <td>
       Kolom satu dibaris dua    </td>
    <td>
       Kolom dua dibaris dua    </td>
    <td>
       Kolom tiga dibaris dua    </td>
   </tr>
  </tbody>
</table>

Hasilnya dari kode diatas seperti dibawah ini

Kolom satu dibaris satu  Kolom dua dibaris satu   Kolom tiga dibaris satu  
 Kolom satu dibaris dua       Kolom dua dibaris dua     Kolom tiga dibaris satu     

Keterangan Kode HTML Untuk Membuat Tabel Beserta Fungsinya

<table> = Wadah tabel itu sendiri / pembatas tabel.
<tbody> = Tabel keseluruhan atau tubuh tabel / table body.
<tr> = table row / baris tabel berfungsi untuk membuat baris baru dalam tabel.
<th> = Table head / tabel kepala berfungsi  untuk membuat kolom tabel dengan huruf tebal.
<td> = Table data / kolom tabel data yang berfungsi untuk membuat kolom baru pada tabel dengan font normal tidak menggunakan format font tebal.

Jika menginginkan mengatur format tabel dengan garis pembatas berwarna pada setiap kolom maka tambahkan STYLE border pada setiap kode <th> atau <td>. Dengan contoh penulisan style-nya adalah sebagai berikut ini .

<th style="border: 1px solid red; padding: 5px;">

Keterangan :
border  = berfungsi untuk membuat garis.
1px = berfungsi untuk mengatur ketebalan garis. Sobat dapat mengubah sesuai keinginan ketebalan garis pembatas.
Solid = berfungsi untuk mengatur bentuk garis pada tabel.
red = berfungsi untuk mengatur warna garis. Untuk warna dapat diubah sesuai keinginan sobat misalnya yellow, blue , brown atau red dan lain sebagainya.
padding = berfungsi untuk mengatur jarak garis dengan karakter yang ada didalam tabel.

Jika sobat hanya menginginkan memberi garis disetiap barisnya maka yang ditambahkan style-nya pada kode <tr> cara penulisannya style juga sama persis yang telah dijelaskan diatas. Yang terpenting penulisan style dengan kode diberi spasi misalnya <tr spasi STYLE="bla bla bla;"> (antara kode tr dengan kata style harus diberi SPASI).


Cara menuliskan kode HTML dalam postingan blog

Cara menuliskan kode dalam postingan blog agar dapat berjalan dengan benar. Masuk laman BLOGGER > ENTRY BARU > HTML

Agar tidak merasa dibingungkan oleh artikel ini, lebih jelasnya lihat contoh gambar dibawah ini.

Demikian cukup sampai disini semoga penjelasan dari artikel ini dapat membantu sobat.

No comments:

Post a Comment