TUTORIAL CARA MEMBUAT TABEL PADA POSTINGAN BLOG

TUTORIAL CARA MEMBUAT TABEL PADA POSTINGAN BLOG

Bagaimana Cara Membuat Tabel dalam Postingan Blogger? 

Dalam membuat Table di Blogspot maupun Wordpress sebenarnya caranya hampir sama yakni dengan mengalihkan tab Compose ke tab HTML yang terletak disebelah kiri atas pada halaman Post (Visual ke HTML untuk Wordpress), nah pada tabs HTML tersebutlah kita musti menuliskan Kode HTML Table secara manual.

TUTORIAL CARA MEMBUAT TABEL PADA POSTINGAN BLOG

Kode HTML Table sendiri terdiri dari tag sebagai berikut :

  • <th>...</th> = Kode HTML untuk pembuka dan penutup Tag Header yakni wilayah yang difungsikan sebagai Header/ Kepala yang nantinya berisi Judul
  • <td>...</td> = Kode HTML untuk Pembuka dan penutup Tag Data, diantara penutup dan pembuka tag ini selanjutnya akan berisi isi atau data dari suatu table yang disesuaikan dengan judul dalam Tag Header.
  • <tr>...</tr>Tag Row atau Bagian dari Kode HTML Table untuk mendefinisikan baris dari suatu Table, bisa diartikan bahwa tag <th>...</th> dan tag <td>...</td> akan selalu berada diantara penutup dan pembuka Tag Row.
  • <table>...</table> =  Pembuka dan Penutup Kode HTML Tabel, Kode ini merupakan identitas dari sebuah Tabel dan pastinya ada pada setiap tabel, sedangkan Tag Row (<tr>...</tr>) akan selalu ada dalam diantara Kode <table>...</table>



Contoh tabel yang terlihat dari sisi visual dan sisi Kode HTML Tabel :

VISUAL TABEL HTML TABLE
TABLE HEADER 1TABLE HEADER 2
Table Data 1Table Data 2
<table border="1px">
<tr>
<th>TABLE HEADER 1</th><th>TABLE HEADER 2</th>
</tr>
<tr>
<td>Table Data 1</td><td>Table Data 2</td>
</tr>
</table>



CSS border-style Property ( jenis border yang digunakan pada tabel )

Apabila sobat tidak menginginkan adanya border atau garis tepi pada tabel, sampeyan tinggal menghapus saja kode ( border="1px" ), namun apabila sobat ingin mengganti jenis border maka perlu diketahui juga CSS border-style Property sebagai berikut :

  • none
  • hidden
  • dotted
  • dashed
  • solid
  • double
  • groove
  • ridge
  • inset
  • outset
  • dotted solid double dashed
  • dotted solid
  • initial
Untuk mengaplikasikan salah satu CSS border-style Property pada kode HTML, sobat tinggal merubah <table border="1px"> dengan menambah kode style yang didalamnya berisi salah satu CSS border-style diatas contohnya sebagai berikut (saya memakai border style dotted) :


<table style="border-style: dotted; border-width: 1px; ">


Bagaimana pendapat sobat mengenai penjelasan Pembuatan Tabel pada Postingan Blogger dan Wordpress diatas? saya berharap Tutorial ini tidak membingungkan dan semoga mampu menjawab keingintahuan sampeyan, namun sebenarnya Tutorial Kode HTML Table diatas bisa dibilang hanya merupakan dasar dari Pembuatan Tabel, jika sobat menghendaki Tutorial yang lebih detail serta ingin lebih mempercantik tampilan Tabel, Sampeyan bisa merujuk ke situs http://www.w3schools.com/html/html_tables.asp

Demikian artikel TUTORIAL CARA MEMBUAT TABEL PADA POSTINGAN BLOG (HTML TABLES). Semoga bermanfaat!!!

TUTORIAL CARA MEMBUAT TABEL PADA POSTINGAN BLOG 
TUTORIAL BLOG