Skip to main content

Cara Membuat Tabel Di Blog

Cara Membuat Tabel Di Blog

Kembali lagi di ViperGoy Blog. Pada kali ini saya akan membahas tentang Cara Membuat Tabel Di Blog. Perlu kita ketahui Tabel Berfungsi sebagai Alat Pembantu untuk memudahkan Pengaturan dan Pemisahan barang - barang seperti Nama, Kode, Harga atau Jika sekolahan digunakan untuk mengatur murid , kelas, nomer absen, dll... Tapi apakah ada Fungsi Tabel Untuk Blog ? Ya jelas ada dong, salah satunya kita gunakan untuk membuat Daftar HP/Gadget, Membuat List Tabel Daftar Blog Dofollow dan Daftar Social Bookmark, dll.... Nah, yang mungkin ini yang anda tanyakan untuk membuat itu semua memerlukan Tabel, Jadi, Bagaimana Membuat Tabel Di Blog Dengan CSS dan Mudah ? Saya akan menjawabnya , simak paragraf dibawah ini.

Cara Membuat Tabel Dengan CSS Di Blog :

Seperti yang saya ketahui untuk membuat Tabel kita harus mengerti dasar - dasarnya seperti :
  1. <TR>
  2. <TD>
  3. <TH>

dan ada juga Kode HTML Pembantu seperti :
  1. Border
  2. Cellpadding
  3. Cellspacing
  4. Width
  5. Dan Lain - Lain..

Tingkat 1 :
Contoh Paling Dasar adalah Membuat Tabel Secara Utuh atau Tanpa Garis :
Kode :

<table>

<tr>
     <td>Top Blog</td>
     <td>URL Blog</td>
     <td>Nice Article</td>
</tr> 
<tr>
      <td>ViperGoy Blog</td>
      <td>www.vipergoy.com</td>
      <td>Cara Membuat Tabel Di Blog</td>
</tr>
</table>

Hasil :

Top Blog URL Blog Nice Article
ViperGoy Blog www.vipergoy.com Cara Membuat Tabel Di Blog
Tingkat 2 :
Oke lanjut ke tingkat kedua, Kita kan Membuat Tabel Dengan Garis :
Kode :

<table border="1">
<tr>
     <td>Top Blog</td>
     <td>URL Blog</td>
     <td>Nice Article</td>
</tr> 
<tr>
      <td>ViperGoy Blog</td>
      <td>www.vipergoy.com</td>
      <td>Cara Membuat Tabel Di Blog</td>
</tr>
</table>

Hasil :

Top Blog URL Blog Nice Article
ViperGoy Blog www.vipergoy.com Cara Membuat Tabel Di Blog

Tingkat 3 :
Mungkin menurut anda contoh tabel atas terlalu kecil, oke kita akan bermain dengan Width :
Kode :

<table border="1" width="500">
<tr>
     <td>Top Blog</td>
     <td>URL Blog</td>
     <td>Nice Article</td>
</tr> 
<tr>
      <td>ViperGoy Blog</td>
      <td>www.vipergoy.com</td>
      <td>Cara Membuat Tabel Di Blog</td>
</tr>
</table>

Hasil :

Top Blog URL Blog Nice Article
ViperGoy Blog www.vipergoy.com Cara Membuat Tabel Di Blog
Tingkat 4 :
Selanjutnya ViperGoy akan kasih Tutorial Membuat Tabel Dengan Judul Tabel atau Tabel Headers dengan :
Kode :

<table border="1">
<tr>
     <th>Top Blog</th>
     <th>URL Blog</th>
     <th>Nice Article</th>
</tr> 
<tr>
      <td>ViperGoy Blog</td>
      <td>www.vipergoy.com</td>
      <td>Cara Membuat Tabel Di Blog</td>
</tr>

<tr>
      <td>Blogger Buzz</td>
      <td>buzz.blogger.com</td>
      <td>Blogger Bringing Comment Google+ in Blogger</td>
</tr>
</table>

Hasil :

Top Blog URL Blog Nice Article
ViperGoy Blog www.vipergoy.com Cara Membuat Tabel Di Blog
Blogger Buzz buzz.blogger.com Blogger Bringing Comment Google+ in Blogger
Tingkat 5 :
Lanjut ke tingkat kelima. Kali ini membuat Tabel dengan CellSpacing dan CellPadding :

CellPadding :
Kode :

<table border="1" cellpadding="10" >
<tr>
     <th>Top Blog</th>
     <th>URL Blog</th>
     <th>Nice Article</th>
</tr> 
<tr>
      <td>ViperGoy Blog</td>
      <td>www.vipergoy.com</td>
      <td>Cara Membuat Tabel Di Blog</td>
</tr>

<tr>
      <td>Blogger Buzz</td>
      <td>buzz.blogger.com</td>
      <td>Blogger Bringing Comment Google+ in Blogger</td>
</tr>
</table>

Hasil :

Top Blog URL Blog Nice Article
ViperGoy Blog www.vipergoy.com Cara Membuat Tabel Di Blog
Blogger Buzz buzz.blogger.com Blogger Bringing Comment Google+ in Blogger

CellSpacing :
Kode :

<table border="1" cellspacing="10" >
<tr>
     <th>Top Blog</th>
     <th>URL Blog</th>
     <th>Nice Article</th>
</tr> 
<tr>
      <td>ViperGoy Blog</td>
      <td>www.vipergoy.com</td>
      <td>Cara Membuat Tabel Di Blog</td>
</tr>

<tr>
      <td>Blogger Buzz</td>
      <td>buzz.blogger.com</td>
      <td>Blogger Bringing Comment Google+ in Blogger</td>
</tr>
</table>

Hasil :

Top Blog URL Blog Nice Article
ViperGoy Blog www.vipergoy.com Cara Membuat Tabel Di Blog
Blogger Buzz buzz.blogger.com Blogger Bringing Comment Google+ in Blogger

Tingkat 6 :
Mungkin ini tutorial Tabel yang terakhir dari ViperGoy Blog deh. Cara Membuat Tabel Dengan Warna ini membuat tabel kita indah dan menarik langsung dicoba :
Kode :

<table border="1">
<tr>
     <th bgcolor="#aaaaaa">Top Blog</th>
     <th bgcolor="#aaaaaa">URL Blog</th>
     <th bgcolor="#aaaaaa">Nice Article</th>
</tr> 
<tr>
      <td bgcolor="#dddddd">ViperGoy Blog</td>
      <td bgcolor="#dddddd">www.vipergoy.com</td>
      <td bgcolor="#dddddd">Cara Membuat Tabel Di Blog</td>
</tr>
<tr>
      <td bgcolor="#dddddd">Blogger Buzz</td>
      <td bgcolor="#dddddd">buzz.blogger.com</td>
      <td bgcolor="#dddddd">Blogger Bringing Comment Google+ in Blogger</td>
</tr>
</table>

Hasil :

Top Blog URL Blog Nice Article
ViperGoy Blog www.vipergoy.com Cara Membuat Tabel Di Blog
Blogger Buzzbuzz.blogger.comBlogger Bringing Comment Google+ in Blogger

Perlu Diingat !
Semuanya bisa anda jadikan satu dan mendapatkan Hasil yang menarik sekali. Jadi apakah anda ingin menyatukan Kode Pembantunya agar lebih baik dari ini ?

Sangat mudah sekali bukan ? Mari kita belajar dengan Paman ViperGoy lagi lain waktu hahaha...
Labels:

Comments

Post a Comment

Popular posts from this blog

AFLIKASI AUTOTEXT DI HP ANDROID UNTUK BLOGGER PEMULA

AFLIKASI AUTOTEXT DI HP ANDROID UNTUK BLOGGER PEMULA-  Sеbеlum menggunakan Android, ѕауа аdаlаh Blackberry user. Salah satu fitur уаng ѕауа sukai dаrі Blackberry аdаlаh AutoText, dimana kita bіѕа menghemat waktu dеngаn menyimpan text atau kalimat dalam bentuk template уаng аkаn kita gunakan sewaktu-waktu. Fitur Auto Text ѕаngаt cocok digunakan оlеh Customer service (CS) toko online уаng tiap hari mesti menjawab pertanyaan calon pembeli, dimana jawabannya bіаѕаnуа ѕаmа saja. Jadi daripada ngetik berulang-ulang, mending kita menggunakan AutoText saja. AFLIKASI AUTOTEXT DI HP ANDROID UNTUK BLOGGER PEMULA AFLIKASI AUTOTEXT Sewaktu pindah kе Android, jujur ѕауа merindukan fitur Autotext blackberry ini. Adapun dі hp android ada fitur уаng namanya Personal Dictionary уаng kurаng lebih ѕаmа fungsinya dеngаn Auto Text. Sayang fitur іnі punya kelemahan уаіtu kalimat/phrasenya ѕаngаt singkat, jumlah huruf уаng diijinkan hаnуа sekitar 60 kata saja. Pendek sekali bukan? Sеtеlаh searching kе Goo...
Post a Comment
Read more

CARA MEMASARKAN PRODUK JUALAN KE SOSIAL

Cara Memasarkan Produk Ke Sosial Media -  Sеbаgаі orang-orang уаng bergelut dеngаn dunia bisnis, Andа pasti harus melakukan persiapan untuk memasarkan bisnis Anda. Salah satu pilihan media promosi уаng terbaik saat іnі аdаlаh social media.  Sebut ѕаја Facebook, Twitter, Instagram, Youtube, Google Plus, LinkedIn, Pinterest, Path, dll. Kita dibanjiri bеgіtu beragamnya platform dеngаn fungsi masing-masing. Baca Juga ;  CARA MENGGUNAKAN AFLIKASI SNAPCHAT TERBARU Perusahaan mulai dаrі besar hіnggа kecil, bаhkаn уаng bеlum buka pun, memanfaatkan social media. Mеrеkа menyadari peran besar social media уаng bіѕа membantu mempercepat proses brand awareness hіnggа berdampak јugа pada penjualan. Cara Memasarkan Produk Ke Sosial Media MEDIA SOSIAL Nаmun bаgаіmаnа јіkа kita tіdаk tahu ара уаng harus dilakukan dеngаn social media? Andа sadar hal іnі penting, tарі tіdаk tahu bаgаіmаnа memulainya. Dі bаwаh іnі ѕауа sajikan 3 prinsip awal ѕеbеlum Andа benar-benar memasarkan produk/jasa An...
Post a Comment
Read more

Cara Memperkecil / Mengurangi Pemakaian Memori RAM Mozilla FireFox Dengan Firemin

Cara Memperkecil Pemakain Memori RAM Mozilla FireFox Dengan Firemin Mozilla Firefox dikenal sebagai salah satu browser terpopuler di dunia. Banyak sekali pengguna FireFox yang menggunakan browser buatan Mozilla tersebut sebagai default Browser. Kelebihan dari browser FireFox ini memiliki banyak adds-on, cepat, dan juga memiliki banyak pilihan derivatif seperti CyberFox, Palemoon, Dan sebagainya. Namun, dibalik semua kelebihan tersebut, Firefox memiliki beberapa kelemahan. Salah satu kelemahan dan FireFox adalah penggunaan memori RAM yang cukup besar. Untuk pemakaian standar saja FireFox bisa tembus memakan RAM hingga mencapai kurang lebih 200 MB. Mozilla sendiri sudah berusaha meng- improve  browser miliknya, namun tetap saja masih terasa besar.  Tetapi sekarang kalian tidak perlu khawatir, karena sekarang sudah ada sebuah aplikasi portable yang dapat mengurangi / reducing  pemakain memori dari Mozilla Firefox. Aplikasi mini tersebut bernama Firemin.  Berikut adala...
Post a Comment
Read more