Saturday, June 06, 2009

CARA MEMBUAT TABEL (HTML) 2

Saya ingin ngelajutin postingan saya yang kemaren murut saya belum selesai. "Kan pahalanya nanggung". Yaitu cara Membuat tabel diblog (HTML), Nah saya sekarang ingin membahas tentang kode CSS yang biasa digunakan untuk cara membuat tabel.
Mungkin bisa langung saja.

Berikut ini adalah kode CSS tag HTML yang biasanya digunakan, berikut keterangannya :

align = left|center|right posisi yang berkaitan dengan dokumen atau isi
background = url gambar backgroud tabel
bgcolor = warna dari background tabel
border = pixel lebar perbatasan
cellspacing = nilai perbatasan antara ruang dan isi sel
cellpadding = nilai ruang antara sel
frame = void|above|below|hsides|lhs|rhs|vsides|box|border menunjukkan bahwa sekitar perbatasan tabel
above : hanya attribut
below :
border , box : empat sisi
lhs : hanya sebelah kiri
void : none (ini adalah nilai per sel)
rules = none|groups|rows|cols|all semua ujung-ujungnya internal sampel
all : antara baris dan kolom
cols : hanya antara kolom
groups : antara kelompok (thead, TFOOT, tbody, dll)
none : rows : hanya antara baris
summary = ringkasan teks untuk digunakan dengan browser di visual --
width = nilai atau persentase yang menunjukkan lebar

Selain itu terdapat sejumlah tag "opsional"


CAPTION membuat keterangan khusus untuk judul
Tbody mengidentifikasi tubuh dari tabel (isi)
Thead mengidentifikasi head
TFOOT mengidentifikasi kaki halaman

CSS properti khusus untuk tabel:

border-spacing: size
Menunjukkan jarak yang memisahkan Tepi-tepi cell berdekatan. Jika Anda menentukan ukuran ini memberikan ruang vertikal dan horisontal.

border-collapse: collapse | separate
Ditentukan akan dianggap sebagai ujung-ujungnya dari dua Cell

empty-cells: show | hide
Mengontrol perbatasan di sekitar mereka dalam Celda yang tidak terlihat konten

table-layout: auto | fixed
Serta untuk menentukan ukuran gambar memungkinkan browser memuat halaman dengan lebih cepat, penggunaan atribut lebar dan tinggi properti dari gaya sesuai untuk mengatur lebar dan tinggi dari setiap elemen tabel substansial meningkatkan kecepatan pada berisi semua data yang banyak itu sendiri.



Contoh Cara Membuat Table

Baris 1 Kolom 1Baris 1 Kolom 2Baris 1 Kolom 3
Baris 2 Kolom 1Baris 2 Kolom 2Baris 2 Kolom 3


kode membuat table

<table style="table-layout: fixed;" align="center" border="1" cellpadding="5" cellspacing="2">
<col style="background-color: chocolate; color: white; font-size: 0.8em;" width="130">
<col style="background-color: yellow; color: black;" width="150">
<col style="background-color: salmon; color: white; text-align: center;" width="180">
<tbody>
<tr><td>Baris 1 Kolom 1</td>
<td>Baris 1 Kolom 2</td>
<td>Baris 1 Kolom 3</td>
</tr>
<tr><td>Baris 2 Kolom 1</td>
<td>Baris 2 Kolom 2</td>
<td>Baris 2 Kolom 3</td>
</tr></tbody></table>



SALAM blogger

ARTIKEL BERKAITAN
*CARA MEMBUAT TABLE (HTML) 1

Digg Google Bookmarks reddit Mixx StumbleUpon Technorati Yahoo! Buzz DesignFloat Delicious BlinkList Furl

7 komentar: on "CARA MEMBUAT TABEL (HTML) 2"

wanda said...

Sip dah keren abiz nih tutorialnya...klo ada waktu kur coba dech..

Your Friend:Myokezone

mardee said...

kok tag >col$lt; nya kok ga ditutup? emang gitu bisa ya?

*belum coba*

Mardee W said...

halah, keliru..
maksudnya tag <col>
kok ga ditutup seperti ini <col/> ? emang bisa tag ga ditutup?
atau aku yg ga liat tutupnya ya? hahahaha..
*efek ngantuk*

ubuh said...

@mardee : wah bener ngntuk nih..hex
menurut yang saya tau untuk tag col bisa tanpa harus ditutup.. kalo mas ingin tau kebenarannya bisa dicoba sendiri.. :)

azzaam said...

sipplah, keren...
thanks tutorialnya :D

MR AR said...

FREE DOWNLOAD SEDUCE ME AND OTHER SEX GAMES ADULT 18+ FOR PC FULL VERSION LATEST VERSION COMPRESSED 18+ DOWNLOAD FROM HERE-->>>> www.argames786.blogspot.com

Dynamic Meta Tag said...

mantap, artikel lama namun mujarab, thanks sob

Post a Comment

Sobat-sobat semua sudah punya rekening virtual gak buat transaksi di internet. Kalo belum daftar di PAYPAL, Klik aja Icon dibawah Ini

Sign up for PayPal and start accepting credit card payments instantly.