Minggu, 25 Maret 2012

Membuat Table Pada Blog Post


dwijayasblog.blogspot.com-Membuat-Table-Pada-Blog-Post

Artikel ini membahas tentang Membuat Table Pada Blog Post. Selamat membaca.
Untuk mengatur tabel, maka pertama-tama Anda harus menetapkan jumlah baris dan kolom. Biasanya yang sulit untuk memahami markup tabel pada html yang mengandaikan garis tabel deskripsi demi baris.

Contoh markup tabel:
<table> </table> - pembuka dan penutup tabel.
<tr> </tr> - pembuka dan penutup baris pada tabel.
<td> </td> - pembuka dan penutup sel pada tabel.

Dengan kode script: 
<table>
<tbody>
<tr>
<td> 1 cell</td>
<td> 2 cell</td>
</tr>
</tbody>
</table>

Hasilnya:
1 cell 2 cell

Contoh kode script berikutnya: 
<table>
<tbody>
<tr>
<td>cell 1</td>
<td>cell 2</td>
<td>cell 3</td>
</tr>
<tr>
<td>cell 4</td>
<td>cell 5</td>
<td>cell 6</td>
</tr>
<tr>
<td>cell 7</td>
<td>cell 8</td>
<td>cell 9</td>
</tr>
</tbody>
</table>

Hasilnya:
cell 1 cell 2 cell 3
cell 4 cell 5 cell 6
cell 7 cell 8 cell 9

Untuk menyatukan dua baris atau dua kolom sel pada tabel maka harus menambahkan:
colspan - untuk menyatukan kolom sel
rowspan - untuk menyatukan baris sel

Contoh kode script: 
<table border="1">
<tbody>
<tr>
<td colspan="2">cell 1</td>
<td>cell 1</td>
</tr>
<tr>
<td>cell 3</td>
<td>cell 4</td>
<td rowspan="2">cell 5</td>
</tr>
<tr>
<td>cell 6</td>
<td>cell 7</td>
</tr>
</tbody>
</table>

Hasilnya:
cell 1 cell 1
cell 3 cell 4 cell 5
cell 6 cell 7

Untuk menginput teks dalam tabel Anda bisa mengaturnya dengan menggunakan kode script:
align - untuk mengatur teks secara horizontal.
valign - untuk mengatur teks secaravertical.

Contoh kode script: 
<table border="1">
<tbody>
<tr>
<td colspan="2" align="center">cell 1</td>
<td>cell 2</td>
</tr>
<tr>
<td>cell 3</td>
<td>cell 4</td>
<td rowspan="2" valign="top"> cell 5</td>
</tr>
<tr>
<td>cell 6</td>
<td>cell 7</td>
</tr>
</tbody>
</table>

Hasilnya:
cell 1 cell 2
cell 3 cell 4 cell 5
cell 6 cell 7

Dengan memberikan nilai khusus pada border tabel maka akan menghasilkan bentuk border tabel tertentu.

Contoh kode script: 
<table border="5">
<tbody>
<tr>
<td colspan="2" align="center">cell 1</td>
<td>cell 2</td>
</tr>
<tr>
<td>cell 3</td>
<td>cell 4</td>
<td rowspan="2" valign="top"> cell 5</td>
</tr>
<tr>
<td>cell 6</td>
<td>cell 7</td>
</tr>
</tbody>
</table>

Hasilnya:
cell 1 cell 2
cell 3 cell 4 cell 5
cell 6 cell 7

Jika nilai border ="0", maka hasilnya seperti di bawah ini:
cell 1 cell 2
cell 3 cell 4 cell 5
cell 6 cell 7

Demikian pembahasan tentang  Membuat Table Pada Blog Post. Selamat mencoba dan semoga berhasil.
Back To Top