Wadoh…. ternyata masih banyak yg bingung ama TD dan TR yah?

Gomennasai (Maaf), ternyata mencoba share ilmu via web agak susah dibanding aku ngajar depan kelas ^^

Aku kembali coba jelasin deh

Buat yang baru kenal HTML table dan mau baca intronya, harap menuju http://www.uang.persusi.org/?p=37 Udah aku jelasin basicnya Table ^^

Now time to explain TD and TR

Still remember ama table yg dibawah ini?

Sekarang aku coba ganti huruf2 yang ditengah dengan kobinasi huruf dan angka. Smoga bs memperjelas beda TD dan TR

Saya ibaratkan ANGKA ADALAH TD dan HURUF ADALAH TR

Oke… Jadi saat anda mengatur TR, maka anda akan mengatur banyaknya BARIS. Kalau bingung apa itu baris, ibaratkan dia seperti ‘garis cakrawala’ (Cuman beda B dan G). Jadi dia merupakan sisi horizontal (caraku dulu ngapalin beda baris ama kolom)

Sedangkan untuk Kolom, ya sisanya horizontal berarti vertikal ^^

Ingat.. dalam table, kita kudu menyusun TR nya dulu baru ngebuat TD nya

Jadi buat kurung TR dengan <TR></TR> baru isi dengan dengan jumlah TD dengan <TD></TD>

Jadi ingat

Baris = TR
Kolom = TD

Masih bingung? jangan pls.. saya bingung gimana jelasin lg kalau msh bingung. tapi tanya msh tetetp boleh weheheheh

Sekarang gimana kalau saya mau buat spt ini

Bisa ga liat apa beda antara table pertama dan kedua? Bisa liat ga bagaimana HURUF 2 yg tadinya ada dalam table TERGABUNG?

Yups… itu lah 2 jenis penggabungan kotak dalam table

Kalau menggabungkan BARIS disebut dengan COLSPAN

Kalau menggabungkan KOLOM disebut dengan ROWSPAN

Cara penulisan, cukup ketik COLSPAN atau ROWSPAN trus kasih jumlah kotak yang mau digabung, terakhir DELETE kotak2 (pasangan TD) yang udah dileburkan jadi satu.

Oh iya, coding tersebut taruh di TD pertama yang mau dilebur (Tergantung di posisi baris keberapa)

Dari pada bingung, langsung aja lihat coding dibawah ini

<table width=”398″ height=”234″ border=”1″ align=”center” bordercolor=”#FF0000″ cellpadding=”2″ cellspacing=”3″>

<tr>
<td colspan=”3″ bgcolor=”#00FF00″> <!– Ini untuk menggabungkan 1A 2 A dan 3 A. Lihat kan kalau TD yg tadinya ada, jd lenyap dan ditaruh di antara TD dr kolom pertama–>
<font color=”#000000″ face=”Verdana” Size=”3″> 1 </font>
<font color=”#FFFFFF” face=”Verdana” Size=”3″> 2 </font>
<font color=”#FFFFFF” face=”Verdana” Size=”3″> 3 </font>
</td>
</tr>

<tr>
<td width=”113″ rowspan=”2″> <!– Ini untuk menggabungkan 1B dan 1C. –>
<font color=”#FFFFFF” face=”Verdana” Size=”3″> 4 </font>
<font color=”#FFFFFF” face=”Verdana” Size=”3″> 7 </font>
</td>
<td width=”153″>
<font color=”#FFFFFF” face=”Verdana” Size=”3″> 5 </font>
</td>
<td width=”100″>
<font color=”#FFFFFF” face=”Verdana” Size=”3″> 6 </font>
</td>
</tr>

<tr>
<td>
<font color=”#FFFFFF” face=”Verdana” Size=”3″> 8 </font>
</td>
<td>
<font color=”#FFFFFF” face=”Verdana” Size=”3″> 9 </font>
</td>
</tr>

</table>

Ada pertanyaan, silahkan tanya aja…. ^^