CARA MEMBUAT TABEL / KOTAK PADA POSTINGAN

Tabel atau kotak berguna untuk menempatkan file ( teks,kode script,gambar dll ) yang kita anggap penting pada postingan.

Disamping untuk membedakan dengan teks biasa memasang file dalam kotak juga akan memperindah tampilan halaman blog.

Untuk membuat kotak dalam postingan,kita harus menggunakan kode HTML <table> ..... </table>yang didalamnya terdapat berbagai atribut a.l :

• bordercolor --> warna dari garis tabel
  
• bgcolor --> warna dari background tabel
  
• cellpadding --> jarak antara tulisan dengan garis luar tabel
  
• cellspacing --> jarak antar tulisan
  
• border --> ketebalan garis pinggir tabel
  
  
  • dotted --> garis titik putus-putus
    
  • dashed --> garis datar putus-putus
    
  • double --> garis rangkap dua

• align --> posisi dari isi tabel, bisa kiri, tengah, atau kanan
  
• width --> lebar tabel
  
• height --> tinggi tabel

Dari pada membuat bingung,kita akan mencoba membuat sebuah tabel / kotak sederhana dengan kode sbb :

<table width="250" border="1"> <tr> <td> Isi Tabel </td> </tr> </table>

maka jadi :

Isi Tabel

coba perhatikan tulisan yang berwarna :

     a.hijau          : lebar tabel / kotak

     b.biru           : tebal garis

     c.merah        : file yang akan dimasukan

Sekarang kita akan memasukan beberapa atribut dalam kotak di atas :

<tablewidth="250"border="7"> <tr bgcolor="#81BEF7"> <td align="center"> Isi Tabel </td> </tr> </table>

maka jadi :

Isi Tabel

perhatikan warna :

     d.ungu           : warna background

     e.kuning        : posisi file

Bagaimana cara membuat beberapa kotak yang terdiri kolom dan baris..?

Untuk membuat kolom dan baris kita menggunakan kode sbb :

1.Dua Kolom

<table width="400" border="7"> <tr bgcolor="#99CC00"> <td align="center"> Kolom 1 Baris 1 </td> <td align="center"> Kolom 2 Baris 1 </td> </tr> </table>

maka jadi :

Kolom 1 Baris 1

Kolom 2 Baris 1

2.Dua Kolom Tiga Baris

<table width="400" border="5" bordercolor="blue"> <tr bgcolor="#33CCCC"> <td align="center"> Kolom 1 Baris 1 </td> <td align="center"> Kolom 2 Baris 1 </td> </tr> <tr bgcolor="#33CCCC"> <td align="center"> Kolom 1 Baris 2 </td> <td align="center"> Kolom 2 Baris 2 </td> </tr bgcolor="#33CCCC"> <tr> <td align="center"> Kolom 1 Baris 3 </td> <td align="center"> Kolom 2 Baris 3 </td> </tr> </table>

maka jadi :

Kolom 1 Baris 1	Kolom 2 Baris 1
Kolom 1 Baris 2	Kolom 2 Baris 2
Kolom 1 Baris 3	Kolom 2 Baris 3

Sampai sini dulu ah capai nulis panjang-panjang.....Untuk yang kolom dan barisnya banyak,Ayo kita cari bersama tutorialnya...!!

Semoga bermanfaat.....