Membuat Tabel Sederhana pada Web

Senin, 14 Februari 2011

Postingan lalu saya membahas tentang cara membuat grafik batang kan??. Sekarang saya akan memberikan cara membuat tabel sederhana. Tabel yang saya buat bentuknya seperti ini...


Script yang saya buat sehingga menghasilkan tabel sederhana seperti diatas adalah :

<!DOCTYPE HTML>
<html lang="en">
<head>
<title>Tugas Praktikum Tabel</title>
</head>
<body>
<table border="5" cellspacing=1 frame="hsides" rules="groups">
<caption><b>TABEL PERBANDINGAN SIKAP</b></caption>

<colgroup align="center">
<colgroup align="center">
<colgroup align="center">
<colgroup align="center">
<colgroup align="center">
<colgroup align="center">
<tr><th width="35">No.<th width="200">Spesifikasi Sikap
<th width="50">Poin
<th width="100">Bejo
<th width="100">Bajul
<th width="100">Peno
<th width="100">Koplak</tr>

<tbody>
<tr><td align="center">1
<td>Kerja Keras
<td align="center">8<td align="center">X
<td align="center">X
<td align="center">-
<td align="center">-
</tr>
<tr><td align="center">2
<td>Tekun
<td align="center">9<td align="center">X
<td align="center">X
<td align="center">X
<td align="center">-
</tr>
<tr><td align="center">3
<td>Tidak Sombong
<td align="center">6<td align="center">X
<td align="center">-
<td align="center">-
<td align="center">-
</tr>
<tr><td align="center">4
<td>Sabar
<td align="center">7<td align="center">X
<td align="center">-
<td align="center">-
<td align="center">-
</tr>
<tr><td align="center">5
<td>Pemaaf
<td align="center">10<td align="center">X
<td align="center">-
<td align="center">X
<td align="center">-
</tr>
<tbody>
<tr><td align="center">6
<td>Pemalas
<td align="center">-5<td align="center">-
<td align="center">-
<td align="center">X
<td align="center">X
</tr>
<tr><td align="center">7
<td>Ceroboh
<td align="center">-3<td align="center">-
<td align="center">-
<td align="center">X
<td align="center">X
</tr>
<tr><td align="center">8
<td>Tinggi Hati
<td align="center">-7<td align="center">-
<td align="center">X
<td align="center">-
<td align="center">X
</tr>
<tr><td align="center">9
<td>Pendendam
<td align="center">-10<td align="center">-
<td align="center">X
<td align="center">X
<td align="center">X
</tr>
<tr><td align="center">10
<td>Kurang Vitamin
<td align="center">-11<td align="center">-
<td align="center">X
<td align="center">-
<td align="center">X
</tr>
<tbody>
<tr>
<td colspan=3 align="center"><b>Jumlah Poin</b></td>
<td align="center">40</td>
<td align="center">-11</td>
<td align="center">1</td>
<td align="center">-36</td>
</tr>
</table>

<i>Source: informatic-rip.blogspot.com - February, 2011 </i>
<br>&copy; amaLameLia </br>

</body>
</html>

Demikianlah.. Semoga Bermanfaat.. Selamat Belajar.. Terimakasih.. ^^

0 komentar:

Posting Komentar