Langkah-langkahnya sebagai berikut :
1. Buka editor teks seperti notepad atau yang lainnya, disarankan notepad++ setelah itu ketikkan kode HTML berikut:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Grafik Berbasis Tabel</title>
</head>
<body>
<p><blink><font color="Purple" face="arial" size="6">Membuat Desain Tabel Perbandingan Item</font></blink></p>
<font color="purple" face="time new roman" size="3"><b>Ulfa Fauziah</font>
<table width="470" height="401" border="0">
<tr>
<td colspan="8" style="border-bottom:#000000 solid;"><p align="center"><font color="black" face="TIME NEW ROMAN" size"4">PERBANDINGAN FITUR</font></td>
</tr>
<tr>
<td width="31"align="center"><b>No</td>
<td width="0" rowspan="10" style="border-left:#000000 solid thin;"> </td>
<td width="208" align="center"><b>Fitur</td>
<td rowspan="10" style="border-left:#000000 solid thin;padding-left:-5px;" width="0"> </td>
<td width="0" align="center"><b>Enterprise</td>
<td width="0" rowspan="10" style="border-left:#000000 solid thin;"> </td>
<td width="0"align="center"><b>Pro</td>
<td width="0"align="center"><b>Free</td>
</tr>
<tr>
<td colspan="12" style="border-top:#000000 solid thin;"></td>
</tr>
<tr>
<td align="center">1</td>
<td>Garansi seumur hidup</td>
<td align="center">X</td>
<td align="center">-</td>
<td align="center">-</td>
</tr>
<tr>
<td align="center">2</td>
<td>Multiuser</td>
<td align="center">X</td>
<td align="center">-</td>
<td align="center">-</td>
</tr>
<tr>
<td align="center">3</td>
<td>Update otomatis</td>
<td align="center">X</td>
<td align="center">X</td>
<td align="center">-</td>
</tr>
<tr>
<td align="center">4</td>
<td>Cetak Laporan</td>
<td align="center">X</td>
<td align="center">X</td>
<td align="center">-</td>
</tr>
<tr>
<td align="center">5</td>
<td>Notifikasi error</td>
<td align="center">X</td>
<td align="center">X</td>
<td align="center">X</td>
</tr>
<tr>
<td colspan="10" style="border-top:#000000 solid thin;"></td>
</tr>
<tr>
<td align="center">6</td>
<td>Ubah tema</td>
<td align="center">X</td>
<td align="center">X</td>
<td align="center">X</td>
</tr>
<tr>
<td align="center">7</td>
<td>Try ikon</td>
<td align="center">X</td>
<td align="center">X</td>
<td align="center">X</td>
</tr>
<tr>
<td colspan="10" style="border-top:#000000 solid;"></td>
</tr>
</table>
</body>
</html>
2. Selanjutnya simpan kode-kode html tersebut dengan nama Demo Tugas2.html dan letakkan pada direktori C:\wamp\www
3. Untuk mengetahui hasil dari dokumen html yang kita buat, seperti tutorial sebelumnya yaitu buka Wampserver kemudian buka Localhost. Panggil dokumen html tersebut dengan memanggil tempat dan nama html nya, seperti http://localhost/modul 2/Demo Tugas2.html dan hasilnya seperti gambar di bawah :
Sekian dari saya n semoga bermanfaat….
0 komentar:
Posting Komentar