Sebenarnya saya sudah lama ingin berbagi mengenai bagaimana cara membuat tabel di blog dengan menggunakan kode HTML, namun baru kali ini saya sempatkan untuk mempostingnya. Mengingat karena begitu luas cakupan dan bahasannya dan memerlukan bahasan yang lebih detail agar bisa lebih mudah untuk dipahaminya khususnya bagi para pemula, seperti waktu saya baru belajar mengenai kode html untuk membuat tabel.maka postingan ini akan disambung ke bagian -2,

Istilah tabel sendiri sepertinya sudah akrab di telinga dan terutama mata kita, Tabel dapat diartikan  sebagai sederetan Elemen / cell yang terdiri dari baris dan kolom, setiap elemen mempunyai kedudukan pada baris dan kolom tertentu berikut ini tabel untuk menjelaskan elemen-elemen dalam tabel :
baris ke-1 kolom ke-1baris ke-1 kolom ke-2baris ke-1 kolom ke-3baris ke-1 kolom ke-n
baris ke-2 kolom ke-1baris ke-2 kolom ke-2baris ke-2 kolom ke-3baris ke-2 kolom ke-n
baris ke-3 kolom ke-1baris ke-3 kolom ke-2baris ke-3 kolom ke-3baris ke-2 kolom ke-n
baris ke-n kolom ke-1baris ke-n kolom ke-2baris ke-n kolom ke-3baris ke-n kolom ke-n

Adapun  kode HTML dasar untuk membuat  blog yaitu dengan kode:
  • Tabel selalu dimulai dengan tag pembuka <table><tbody>dan ditutup dengan tag  </tbody></table>
  • Untuk membuat baris diawali dengan tag <tr> dan ditutup dengan tag </tr>
  • Untuk membuat kolom diawali dengan tag <td> dan ditutup dengan tag </td>
Agar penjelasan lebih mudah dipahami mari kita lihat contoh berikut:
  • Membuat Tabel (untuk membuat garis dengan ketebalan garis 1 px pada tabelpada tabel, maka tambahkan atribut border="1" pada tag pembuka ) yang terdiri dari 1 baris dan tiga kolom maka kode HTML nya  adalah:
    <table border="1">
    <tr>
    <td>baris ke-1 kolom ke-1</td>
    <td>baris ke-1 kolom ke-2</td>
    <td>baris ke-1 kolom ke-3</td>
    </tr>
    </table>
    Hasilnya adalah:
    baris ke-1 kolom ke-1 baris ke-1 kolom ke-2 baris ke-1 kolom ke-3
  • Membuat Tabel (untuk membuat garis dengan ketebalan garis 1 px pada tabel, maka tambahkan atribut border="1" pada tag pembuka  ) yang terdiri dari 3 baris dan masing - masing baris terdiri dari 1 kolom maka kode HTML nya adalah:
    <table border="1">
    <tr>
    <td>baris ke-1 kolom ke-1</td>
    </tr>
    <tr>
    <td>baris ke-2 kolom ke-1</td>
    </tr>
    <tr>
    <td>baris ke-3 kolom ke-1</td>
    </tr>
    </tbody></table>
    Hasilnya adalah:
    baris ke-1 kolom ke-1
    baris ke-1 kolom ke-1
    baris ke-3 kolom ke-1
Penggunaan Atribut Tag HTML pada Tabel
Setiap tag pembuka diatas  <table> <tr> <td> dapat diikuti / ditambahkan atribut untuk menambahkan perintah yang diberikan kepada seluruh elemen yang terletak antara tag pembuka tersebut sampai dengan tag penutupnya  Agar lebih jelas mari kita perhatikan contoh berikut ini:
Misal kita akan membuat tabel yang terdiri dari 3 baris dan 3 kolom dengan menggunakan garis batas (border) sebesar 1 px, dan khusus untuk baris ke - 2 menggunakan background warna biru, maka kode HTMLnya adalah sebagai berikut:
  1. Untuk membuat tabel yang seluruh elemennya diberi garis pinggir dengan ketebalan 1 px, maka pada tag pembuka tabel kita beri atribut border="1", sehingga tag nya menjadi <table border="1">........... </table>
  2. Agar seluruh elemen Tabel pada baris pertama (ke-1) di diberi background warna biru, maka tag pembuka pada baris  pertama (ke-1) atau tag <tr> yang pertama  diberi atribut bgcolor="blue" sehingga tagnya menjadi <tr bgcolor="blue"> .... </tr>
  3. Sehingga Kode HTML nya menjadi:
    <table border="1"><tbody>
    <tr bgcolor="blue"><td>baris ke-1 kolom ke-1</td><td>baris ke-1 kolom ke-2</td><td>baris ke-1 kolom ke-3</td></tr>
    <tr><td>baris ke-2 kolom ke-1</td><td>baris ke-2 kolom ke-2</td><td>baris ke-2 kolom ke-3</td></tr>
    <tr><td>baris ke-3 kolom ke-1</td><td>baris ke-3 kolom ke-2</td><td>baris ke-3 kolom ke-3</td></tr>
    </tbody></table>
    Hasilnya akan nampak seperti ini:
    baris ke-1 kolom ke-1baris ke-1 kolom ke-2baris ke-1 kolom ke-3
    baris ke-2 kolom ke-1baris ke-2 kolom ke-2baris ke-2 kolom ke-3
    baris ke-3 kolom ke-1baris ke-3 kolom ke-2baris ke-3 kolom ke-3
Adapun Atribut lain dari Tag HTML untuk Tabel akan dijelaskan pada postingan berikutnya.
Demikian Postingan kali ini mengenai cara Membuat Tabel di Blog dengan Kode HTML, semoga bermanfaat,

Produk Kami
  1. 1 SET MARAWIS POLOS
  2. HADRAH STANDARD QUALITY
  3. HADROH / HADRAH SUPER QUALITY
  4. JUAL ALAT MUSIK MARAWIS ONLINE
  5. JUAL DRUMBAND / MARCHING BAND
  6. MARAWIS BATIK
  7. REBANA QOSIDAH STANDAR
  8. REBANA QOSIDAH SUPER QUALITY
Adapun tutorial Blogspot lainnya  yang mungkin Anda cari:
  1. CARA MUDAH MEMBUAT BLOG DI BLOGSPOT
  2. Cara Daftar dan Verifikasi Blog di Google Webmaster Tool
  3. Cara Kompres CSS, HTML, JavaScript Template Blog 
  4. Cara Membuat Bullets dan Numbering Tag HTML pada Posting Blog
  5. Cara Membuat Daftar Isi Blogger di Widget atau Postingan
  6. Cara Membuat Hyperlink Text pada postingan Blogspot
  7. Cara Membuat Kode HTML Link Gambar pada Blogspot
  8. Cara Membuat Link Gambar Berkedip di blogspot
  9. Cara Membuat Link Text Berkedip di Blogspot
  10. Cara Menampilkan Kode HTML dalam Postingan Blog
  11. Mengenal Kode Tag HTML Dasar pada Web / Blog
  12. Tips membuat Atribut HTML link pada Blogspot agar SEO Friendly
  13. Tips/Cara Membuat Meta Tag HTML Agar Blog SEO Friendly