Membuat Table Dengan Notepad | HTML

Membuat Table Dengan Notepad | HTML

recudo.com - Table adalah salah satu media data yang ditampilkan di media web, dengan hold atau header dari capitan table tersebut yang kemudian di isi data

Manfaat table:
1. Table dapat digunakan untuk menampilkan teks, link, grafik, item lainnya yang dapat disajikan dalam kotak
2. Table dapat digunakan untuk menyajikan informasi atau bahkan dapat diperkuat dengan batas warna dan grafik sehingga table tersebut terbentuk dekorasi

Dasar-dasar tag table

<table>
<tb>. . . </tb>
<td>. . . </td>
</table>

Table Properties :

Border Memberikan Garis tepi pada Table
Cellspacing Mengeser jarak dalam pixel antar batas dalam dan luar
Cellspdaing Mengeser jarak pixel antara batas dalam dan teksnyae
Align Penyatuan posisi pada table, kiri, kanan, tengah
BgColor Mengatur warna pada background pada table
Rowspan Untuk mengeset jumlah baris kebawah
Colspan Memberikan Garis tepi pada Table
Cellspacing Untuk mengeset jumlah kolom kekanan
Width Untuk mengatur lebar table
Height Untuk mengatur tinggi table

Nah disini saya akan memberikan sedikit cara untuk membuat table bertema Rekapitulasi Nilai dengan format HTML menggunakan Notepad

Pertama buka Notepad kalian lalu masukan

<html>
<head>
<title> Tugas Latihan 3</title>
</head>
<body> 

note: Tugas Latihan3 itu bisa kalian ganti judul sesuka kalian


Kemudian masukan 

<table border="1">
<td colspan="6"><center>Rekapitulasi Nilai</td>
<tr>
<th>Nama</th>
<th>Absen</th>
<th>Tugas</th>
<th>Quiz</th>
<th>UTS</th>
<th>UAS</th>
</tr> 

Maka akan terlihat seperti gambar ini


Kemudian masukan

<tr>
<td>Abdul Hadi</td>
<td>11</td>
<td>70</td>
<td>70</td>
<td>75</td>
<td>70</td>
</tr>
<tr>
<td>Beni</td>
<td>10</td>
<td>65</td>
<td>65</td>
<td>60</td>
<td>60</td>
</tr>
<tr>
<td>Deni</td>
<td>9</td>
<td>50</td>
<td>50</td>
<td>45</td>
<td>60</td>
</tr>
<td>Iko</td>
<td>14</td>
<td>80</td>
<td>80</td>
<td>90</td>
<td>85</td>
</tr>
<tr>
<td>Mhd Stria</td>
<td>13</td>
<td>75</td>
<td>75</td>
<td>85</td>
<td>80</td>
</tr>

Kemudian save as



Maka akan terlihat hasil seperti dibawah ini


Selesai table sederhana yang dapat saya bagikan, Semoga ber manfaat..


EmoticonEmoticon