Info Mayata

Menyajikan segala informasi yang dijumpainya di dunia maya dengan ringkas

Kode HTML untuk Membuat Tabel

by MOH. Tajuddin N. S , at Tuesday, July 07, 2015 , have 0 komentar
TAG DASAR
Cara membuat tabel dengan kode HTML diperlukan 3 tag dasar yaitu : TABLE, TR, TD. Tag  TABLE  untuk menandai sebuah tabel, TR untuk membentuk baris, TD untuk membentuk kolom. Secara default nilai border=0, jadi tabel akan tampil pada browser tanpa bingkai.  Untuk dapat menampilkan bingkai, maka nilai border harus diberi nilai minimal =1.
Contoh , di bawah ini adalah serangkaian kode HTML  untuk membuat tabel :
<table border=1>
<tr><td>tanggal</td></tr></table>

Hasilnya, browser akan menampilkan gambar tabel seperti  di bawah ini :
Cara membuat tabel dengan kode html
CARA MEMBUAT TABEL  1 BARIS 2 KOLOM
Berikut ini adalah cara  membuat tabel  dengan kode HTML 1 baris 2 kolom, lihat penerapannya di bawah ini  :
<table border=1>
<tr><td>tanggal</td><td>nama</td></tr></table>
Hasilnya,   browser akan menampilkan gambar tabel seperti di bawah ini :
Cara membuat tabel dengan kode html
CARA MEMBUAT TABEL 3 BARIS  1 KOLOM
Berikut ini adalah cara membuat tabel dengan kode HTML 3 baris 1 kolom adalah sebagai berikut :
<table border=1>
<tr><td>tanggal</td></tr><tr><td>kota</td></tr><tr><td>jenis kelamin</td></tr></table>
Hasilnya,   browser akan menampilkan gambar tabel seperti di bawah ini :
Cara membuat tabel dengan kode html
CARA MEMBUAT TABEL DENGAN ATRIBUT CELLSPACING
Atribut CELLSPACING digunakan untuk menentukan jarak antar sel pada sebuah tabel. Lihat penerapan CELLSPACING  pada kode HTML berikut ini :
<table border=1 cellspacing=10>
<tr><td>becak</td><td>sepeda</td></tr><tr><td>mobil</td><td>motor</td></tr></table>
Hasilnya,   browser akan menampilkan gambar tabel seperti di bawah ini :
Cara membuat tabel dengan kode html

CARA MEMBUAT TABEL DENGAN ATRIBUT CELLPADDING
Atribut CELLPADDING  digunakan  untuk member jarak antara sel dengan tulisan. Lihat penerapannya pada kode HTML berikut ini :
<table border=1 cellpadding=10>
<tr><td>becak</td><td>sepeda</td></tr><tr><td>mobil</td><td>motor</td></tr></table>
Hasilnya,   browser akan menampilkan gambar tabel seperti di bawah ini :
Cara membuat tabel dengan kode html
CELLSPACING DAN CELLPADDING  DIPAKAI BERSAMA – SAMA
Jika kedua atribut tersebut dipakai bersamaan dalam pembuatan tabel, maka penerapannya seperti kode HTML berikut ini :
<table border=1 cellpadding=10 cellspacing=10>
<tr><td>becak</td><td>sepeda</td></tr><tr><td>mobil</td><td>motor</td></tr></table>
Hasilnya,   browser akan menampilkan gambar tabel seperti di bawah ini :
Cara membuat tabel dengan kode html
MENENTUKAN LEBAR KOLOM DENGAN PROSENTASE ( WIDTH=100% )
Jika lebar kolom ditentukan 100 %, maka tampilan tabel akan melebar memenuhi lebar halaman. Jika lebar setiap kolom tidak ditentukan,  maka lebar 100% akan terbagi sama lebar untuk setiap kolomnya. Apabila jumlah kolomnya 2, maka tabel tersebut akan terbagi menjadi 2 sama lebar, masing – masing 50%.
Lebar kolom pada tabel dapat ditentukan tidak sama lebar, artinya masing – masing kolom lebarnya tidak sama. Lihat contoh penerapannya pada kode HTML berikut ini :
<table border=1 width=100%>
<tr><td width=25%>becak</td><td width=75%>sepeda</td></tr><tr><td width=25%>mobil</td><td width=75%>motor</td></tr></table>
Hasilnya,   browser akan menampilkan gambar tabel seperti di bawah ini :
Cara membuat tabel dengan kode html


MENENTUKAN LEBAR DAN TINGGI KOLOM DENGAN SATUAN PIXEL
Untuk membuat tabel, lebar kolom ( WIDTH ) dan tinggi kolom ( HEIGHT ) dapat ditentukan dengan satuan pixel. Lihat penerapannya dengan kode HTML berikut ini :
<table border=7 >
<tr height=40><td width=150>becak</td><td width=250>sepeda</td></tr><tr height=80><td width=150>mobil</td><td width=250>motor</td></tr></table>
Hasilnya,   browser akan menampilkan gambar tabel seperti di bawah ini :
Cara membuat tabel dengan kode html
PERATAAN TULISAN DALAM TABEL
Perataan tulisan dalam sebuah tabel menggunakan tag ALIGN  ( untuk perataan horizontal )  dan VALIGN ( untuk perataan vertical ). Untuk lebih memahaminya lihat contoh kode HTML berikut ini :
<table border=7 >
<tr height=40><td width=150 align=left valign=top>becak</td><td width=250 align=right valign=middle>sepeda</td></tr><tr height=80><td width=150 align=right valign=bottom>mobil</td><td width=250 align=center valign=middle>motor</td></tr></table>
Hasilnya,   browser akan menampilkan gambar tabel seperti di bawah ini :
Cara membuat tabel dengan kode html

Mudah – mudahan materi belajar HTML tentang cara membuat tabel dengan kode HTML di atas bermanfaat bagi anda.

Sumber: http://www.edyutomo.com/internet-dan-komputer/cara-membuat-tabel-dengan-kode-html
MOH. Tajuddin N. S
Kode HTML untuk Membuat Tabel - written by MOH. Tajuddin N. S , published at Tuesday, July 07, 2015, categorized as Informasi , Tips dan Trik , Tutorial Blog . And have 0 komentar
No comment Add a comment

1. Berkomentarlah menggunakan kalimat yang baik dan sopan, serta sesuai topik Artikel di atas. Komentar yang tidak sesuai topik akan dihapus.

2. Tidak diperbolehkan menggunakan link hidup atau live link, link akan otomatis terhapus guna mencegah spam.

3. Sebelum bertanya, pastikan sobat sudah membaca seluruh isi Artikel.

4. Jika bertanya sesuatu, jangan lupa untuk memberi tanda centang pada Beri tahu saya atau Notify me agar sobat menerima pemberitahuan balasan melalui email.

5. Follow blog M-TAJUDDIN-NS untuk mendapatkan update Artikel terbaru dan jangan lupa tekan tombol share jika sobat merasa Artikel di atas bermanfaat.

Cancel Reply
GetID

Subscriber

Followers

Copyright ©2013 Info Mayata by
Theme designed by Damzaky - Published by BLOG MR.W
Powered by Blogger