Cara Membuat Tabel Di Web atau Blog Dengan Menggunakan Code HTML

Cara Membuat Tabel Di Web atau Blog Dengan Menggunakan Code HTML Untuk kali ini akan membahas bagaimana cara membuat table dengan menggunakan kode html, ini merupakan beberapa contoh tag yang umum digunakan adalah sebagai berikut;
1. Kode tabel dengan Tanpa menggunakan Border

<table>
<tr><td>awal</td></tr>
<tr><td>akhir</td></tr>
</table>
Hasil coding dibawah:
awal
akhir

<table>
<tr> <td>awal</td>
<td>akhir</td></tr>
</table>
Hasil coding dibawah:
awal akhir

2. Kode tabel dengan menggunakan Border
<table border="1">
<tr><td>awal</td></tr>
<tr><td>akhir</td></tr>
</table>
Hasil coding dibawah:
awal
akhir

<table border="1">
<tr><td>awal</td>
<td>akhir</td></tr>
</table>
Hasil coding dibawah:
awal akhir

<table border="1">
<tr><td>awal1</td>
<td>akhir1</td></tr>
<tr><td>awal2</td>
<td>akhir2</td></tr>
</table>
Hasil coding dibawah:
awal1 akhir1
awal2 akhir2
3. Kode tabel dengan menggunakan Colspan dan Rowspan
  • Menggunakan Colspan

<table border="1">
<tr><td>awal1</td><td colspan="2">akhir1</td></tr>
<tr><td>awal2</td><td>akhir2a</td><td>akhir2b</td></tr>
</table>
Hasil coding dibawah:
awal1akhir1
awal2akhir2aakhir2b

  • menggunakan Rowspan

<table border="1">
<tr><td>awal1</td><td>akhir1</td></tr>
<tr><td rowspan="2">awal2</td><td>akhir2a</td></tr>
<tr><td>akhir2b</td></tr>
</table>
Hasil coding dibawah:
awal1akhir1
awal2akhir2a
akhir2b
4. Table didalam table
<table border="1">
<tr><td>awal
<table border="1"><tr><td>akhir</td></tr></table>
</td></tr>
</table>
Hasil coding dibawah:
awal
akhir
5. Kode table dengan menggunakan Cellpadding dan Cellspacing

  • Tanpa Menggunakan Cellpadding

<table border="1">
<tr><td>awal</td></tr>
</table>
Hasil coding dibawah:
awal

  • Dengan Menggunakan Cellpadding

<table border="1" cellpadding="10">
<tr><td>Awal</td></tr>
</table>
Hasil coding dibawah:
Awal

  • Tanpa Menggunakan Cellspacing

<table border="1">
<tr><td>awal</td></tr>
</table>
<br/>
Hasil coding dibawah:
awal

Dengan Menggunakan Cellspacing
<table border="1" cellspacing="10">
<tr><td>Awal</td></tr>
</table>
Hasil coding dibawah:
Awal

6. Tabel Background color
<table bgcolor="blue" border="1">
<tr><td>
<font color="white">awal</font>
</td></tr>
</table>
Hasil coding dibawah:
awal
Border color
<table bordercolor="blue" border="1">
<tr><td>awal</td></tr>
</table>
Hasil coding dibawah:
Border color
awal
Border style
<table border="5" bordercolor="blue">
<tr><td>awal</td><td>awal1</td></tr>
<tr><td>akhir1</td><td>akhir2</td></tr>
</table>
Hasil coding dibawah:
Border style
awalawal1
akhir1akhir2

5 comments:

  1. Tukar Banner Terpasang Lihat Disini http://bluewers.blogspot.com/2011/11/tukar-link_19.html

    ReplyDelete
  2. Pana hadir dan absen sore..Pena belum pernah memakai seperti ini sobat
    follow dan link balik sukses sobat

    ReplyDelete
  3. mantap artikelnya bang,,, sangat membantu...

    klo ada waktu mampir jg diblogku yah...
    http://edynlaskar09.blogspot.com/

    ReplyDelete