Header Ads

Cara Membuat Tabel Sederhana di Blogger

Cara Membuat Tabel Sederhana di Blogger

Dalam membuat suatu artikel di blog terkadang dibutuhkan sebuah tabel. Tabel tersebut dapat membuat tulisan menjadi rapi sehingga enak untuk dibaca. Di dalam blog ini ada beberapa artikel yang di dalamnya terdapat tabel seperti Cara Memasang User Online Status, dan Stasiun Radio FM di Jakarta dan Sekitarnya.

Untuk membuat tabel sederhana, paling tidak dibutuhkan kode HTML seperti di bawah ini.

<table border="1" style="width: 400px;"><tbody>
<tr><td style="text-align: center;">ELEMEN SEL 1</td><td style="text-align: center;">ELEMEN SEL 2</td></tr>
<tr><td style="text-align: center;">ELEMEN SEL 3</td><td style="text-align: center;">ELEMEN SEL 4</td></tr>
</tbody></table>

Border menunjukkan ketebalan garis tepi tabel. Semakin besar angka atau nilainya maka semakin tebal garis tepi tabelnya. Bila nilainya diganti dengan nol (0px) maka garis tabelnya menjadi tidak terlihat.

Text-align: center; menunjukkan perataan sebuah teks berada di tengah-tengah. Kalau ingin teksnya menjadi rata kanan maka kata center diganti dengan right. Left untuk rata kiri dan justify untuk rata kiri-kanan.

Width menunjukkan lebar dari suatu tabel tersebut. Angka 400px dapat diganti sesuai keperluan. kalau mau menyamakan dengan lebar halaman posting, tinggal diganti saja angka 400px menjadi 100%.

<tr> ... </tr> menunjukkan baris sebuah tabel. Sedangkan <td> ... </td> menunjukkan sel sebuah tabel. Bentuk kode HTML di atas adalah tabel yang mempunyai 2 kolom dan 2 baris. ELEMEN SEL dapat diisi dengan teks, link, atau gambar. Bila ingin menambah jumlah baris atau kolom, tinggal ditambahkan saja kode HTML untuk membentuk baris dan kolom.

Bila kode HTML tabel di atas diletakkan pada menu Edit HTML, maka hasilnya akan terlihat seperti di bawah ini.

ELEMEN SEL 1ELEMEN SEL 2
ELEMEN SEL 3ELEMEN SEL 4

No comments

Comment Policies:

1. NO SPAM
2. NO LIVE LINK

Any violation will be deleted within 24 hours, thanks for your attention.

Template images by Ollustrator. Powered by Blogger.