Cara Menciptakan Tabel Pada Postingan Blog

Cara Membuat Tabel Pada Postingan Blog Kolom Membuat tabel di dalam postingan sangatlah sempurna kalau untuk memperindah dan mengakibatkan simple sebuah data yang banyak dan berdampingan. pastinya sehabis diberi tabel pada postingan blog terlihat rapi dan gampang untuk dipahami.

Tutorial Cara Membuat Tabel Pada Postingan Blog kali ini akan diajarkan dari dasar mengenai proses pembuatan garis atau kolom pada tabel. dengan memakai perintah instruksi maka akan menghasilkan Tabel Kolom Postingan di blog.

Semakin panjang saja penjelasannya,, hehehe. eksklusif kita mulai dari awal yaitu pengenalan instruksi sebagai dasar pembuatannya,Untuk membuat tabel pada postingan hanya membutuhkan tiga instruksi perintah utama. <tabel> <tr> dan  <td>

Penjelasan :

1.     <tabel> : perintah untuk menciptakan tabel
2.     <tr>      : perintah untuk menciptakan baris
3.     <td>     : perintah untuk menciptakan kolom 

Itulah instruksi yang nantinya kita gunakan untuk pembuatan

kolom, tabel dan baris. Langsung Coba!!!!

Contoh Penyusunan Kode :

<table>
<tr>
<td>Kolom 1</td>
<td>Kolom 2</td>
</tr>
<tr>
<td>Kolom 3</td>
<td>Kolom 4</td>
</tr>
</table>

Hasil dari instruksi diatas Jika tidak memakai Border :

Kolom 1	Kolom 2
Kolom 3	Kolom 4

Sekarang kita buat berbentuk kotak tabel dengan memakai pemisah yaitu Border jadi untuk menciptakan hasil menjadi kolom kotak kita gunakan perintah border. Perhatikan Contoh Berikut ini:

<table border="1">
<tr>
<td>Kolom 1</td>
<td>Kolom 2</td>
</tr>
<tr>
<td>Kolom 3</td>
<td>Kolom 4</td>
</tr>
</table>

Dengan perintah embel-embel yaitu border maka akhirnya menyerupai ini :

Kolom 1	Kolom 2
Kolom 3	Kolom 4

Keterangan :

1. Angka 1 dengan warna merah yaitu tebal border, kalau ingin ditebalkan tinggal ganti ukuran tebal sesuai impian sobat. 

2. Perhatikan Komponen instruksi dibawah :
<tr>
<td>Kolom 1</td>
<td>Kolom 2</td>
</tr>
<tr>
<td>Kolom 3</td>
<td>Kolom 4</td>
</tr>

Jika diperhatikan warna biru dan merah yaitu sama dan disusun kebawah yang mengakibatkan menjadi bertingkat dua kolom menyerupai referensi diatas.bisa disimpulkan jika ditambah kebawah lagi maka akan bertambah kolomnya.

Contoh Keterangan Nomor 1:

<table border="6">
<tr>
<td>Kolom 1</td>
<td>Kolom 2</td>
</tr>
<tr>
<td>Kolom 3</td>
<td>Kolom 4</td>
</tr>
</table>

 Dengan ukuran border dari 1 aku ganti 6 akhirnya menyerupai ini:

Kolom 1	Kolom 2
Kolom 3	Kolom 4

Contoh Keterangan Nomor 2:

<table border="1">
<tr>
<td>Kolom 1</td>
<td>Kolom 2</td>
<td>Kolom 3</td>
</tr>
<tr>
<td>Kolom 4</td>
<td>Kolom 5</td>
<td>Kolom 6</td>
</tr>
<tr>
<td>Kolom 7</td>
<td>Kolom 8</td>
<td>Kolom 9</td>
</tr>
</table>

Dari perintah diatas maka akhirnya menyerupai ini:

Kolom 1	Kolom 2	Kolom 3
Kolom 4	Kolom 5	Kolom 6
Kolom 7	Kolom 8	Kolom 9

NB:

Untuk Lebar kolom akan menyesuaikan dengan goresan pena atau teks.  jika teman ingin lebar kolom sesuai dengan ukuran, ikuti tutorial dibawah ini:

Test Perintah

Kode perintah Ukuran kolom.

<table border="1" style="width: 500px;"><tbody>
<tr bgcolor="#F2F2F2">
<td align="center"><b>Daftar Isi</b></td>
<td align="center"><b>Keterangan</b></td>
<td align="center"><b>Link</b></td>
</tr>
<tr>
<td align="center" style="width: 100px;">Tutorial</td>
<td align="left" style="width: 300px;">Semua Jenis Tutorial </td>
<td align="center" style="width: 100px;">Download</td>
</tr>
<tr>
<td align="center" style="width: 100px;">Makalah</td>
<td align="left" style="width: 300px;">Makalah Lengkap</td>
<td align="center" style="width: 100px;">Download</td>
</tr>
<tr>
<td align="center" style="width: 100px;">Video</td>
<td align="left" style="width: 300px;">Full Movies</td>
<td align="center" style="width: 100px;">Download</td>
</tr>
</tbody></table>

Hasil dari Kode perintah diatas : 

Daftar Isi	Keterangan	Link
Tutorial	Semua Jenis Tutorial	Download
Makalah	Makalah Lengkap	Download
Video	Full Movies	Download

Keterangan:

500 px yaitu angka yang sudah dijumlahkan dari instruksi yang berwarna merah
100 px pertama lebar kolom kiri
300 px lebar kolom tengah
100 px terakhir lebar kolom kanan

Catatan:

 Untuk menambahkan baris gres copy instruksi yang berwarna MERAH sempurna dibawah </tr> yang terakhir
 Untuk merubah keterangan kolom sanggup eksklusif melalui Compose

Langkah Selanjutnya Kita buat Eksperimen supaya Mendapatkan hasil yang kita inginkan : teman sanggup mencobanya sendiri. hehehe sekian dulu semoga bermanfaat.

Good Luck