Cara Membuat Tabel Dalam Blogspot

Saya yakin sudah banyak yang tau bagaimana cara membuat tabel dalam blog ini, tapi tidak ada salahnya jika saya memposting kembali tips ini untuk memperkaya referensi bagi yang belum paham, sehingga ketika mereka mencari dari search engine dapat dengan mudah menemukan apa yang mereka inginkan karena sudah banyak pilihan

Tabel sangat berguna menampilkan data berupa angka-angka, teks, statistik, gambar dan yang lainnya sehingga lebih terlihat rapih dan tentu saja lebih mudah dipahami oleh pembaca. Untuk membuatnya tentunya diperlukan tag-tag khusus yang membungkus data yang akan kita masukan dalam tabel tersebut.


Kode Dasar Tabel

<table border="1">
<tbody>
<tr><td>1.</td><td>Iwan</td></tr>
<tr><td>2.</td><td>Eko</td></tr>
<tr><td>3.</td><td>Indra</td></tr>
<tr><td>4.</td><td>Putri</td></tr>
</tbody>
</table>

Keterangan
  • Setiap pembuatan table harus dimulai dengan tag<table> dan diakhiri dengan tag </table>
  • Border digunakan untuk menentukan ketebalan border (garis) yang dapat diubah sesuai kebutuhan, semakin besar nilainya maka bordernya akan semakin tebal, jika mengisikan dengan angka nol maka akan menjadi tabel yang tidak bergaris (berborder).
  • Setiap baris harus diawali dengan tag <tr> dan diakhiri dengan tag </tr>
  • Tag <td> (table data) digunakan untuk mengisikan data pada setiap cell dan harus ditutup dengan tag </td>

Nah dari contoh diatas dihasilkanlah bentuk tabel seperti ini







1.Iwan
2.Eko
3.Indra
4.Putri


Nah bila anda ingin membuat tabel menggunakan Header atau judul maka kodenya seperti ini

<table border="1" cellpadding="5" cellspacing="1">
<tbody>
<tr><th>No.</th><th>Nama Teman</th></tr>
<tr><td>1.</td><td>Iwan</td></tr>
<tr><td>2.</td><td>Eko</td></tr>
<tr><td>3.</td><td>Indra</td></tr>
<tr><td>4.</td><td>Putri</td></tr>
</tbody>
</table>

Maka hasilnya seperti ini








No.Nama Teman
1.Iwan
2.Eko
3.Indra
4.Putri



 Semoga NT mengerti dengan penjelasan pendek saya ini . . . .

Tidak ada komentar:

Posting Komentar