Minggu, 06 Maret 2011

Tugas di Rumah 5

Tampilan pemesanan menu makan & minum
Nie tag HTML nya, gw kasi dah.....


< br>

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>

<body>
<script language="JavaScript" type="text/javascript">
<!--
function rst(){
  var mf=document.form1;
  mf.jm1.value="0";  mf.jm2.value="0";  mf.jm3.value="0";
  mf.jm4.value="0";  mf.jm5.value="0";  mf.jt.value="0";
  mf.dsc.value="0";  mf.bayar.value="0";
}

function proc(){
  var mf=document.form1;
  var hrg1=parseInt(mf.hg1.value) * parseInt(mf.jm1.value);
  var hrg2=parseInt(mf.hg2.value) * parseInt(mf.jm2.value);
  var hrg3=parseInt(mf.hg3.value) * parseInt(mf.jm3.value);
  var hrg4=parseInt(mf.hg4.value) * parseInt(mf.jm4.value);
  var hrg5=parseInt(mf.hg5.value) * parseInt(mf.jm5.value);

  mf.jt.value=hrg1+hrg2+hrg3+hrg4+hrg5;
  if (parseInt(mf.jt.value)>50000)
    mf.dsc.value="10000";
  mf.bayar.value=parseInt(mf.jt.value) - parseInt(mf.dsc.value);
}
//-->
</script>

<form name="form1" action="#" >
<table width="600" border="1">
  <tr>
    <th width="10%">No.</td>
    <th width="40%">Makanan/Minuman</td>
    <th width="30%">Harga</td>
    <th width="20%">Pesan</td>
  </tr>
  <tr>
    <td>1</td>
    <td>Bakso Istimewa </td>
    <td>@ <input name="hg1" type="text" id="hg1" value="12000" readonly="true" /></td>
    <td><input name="jm1" type="text" id="jm1"  value="0" onchange="proc(); " /></td>
  </tr>
  <tr>
    <td>2</td>
    <td>Soto Sepesial </td>
    <td>@ <input name="hg2" type="text" id="hg2" value="10000" readonly="true" /></td>
    <td><input name="jm2" type="text" id="jm2" value="0" onchange="proc(); " /></td>
  </tr>
  <tr>
    <td>3</td>
    <td>Mie Ayam Super </td>
    <td>@ <input name="hg3" type="text" id="hg3" value="15000" readonly="true" /></td>
    <td><input name="jm3" type="text" id="jm3" value="0" onchange="proc(); " /></td>
  </tr>
  <tr>
    <td>4</td>
    <td>Es Degan</td>
    <td>@ <input name="hg4" type="text" id="hg4" value="5000" readonly="true" /></td>
    <td><input name="jm4" type="text" id="jm4" value="0" onchange="proc(); " /></td>
  </tr>
  <tr>
    <td>5</td>
    <td>Es Campur </td>
    <td>@ <input name="hg5" type="text" id="hg5" value="7000" readonly="true" /></td>
    <td><input name="jm5" type="text" id="jm5" value="0" onchange="proc(); " /></td>
  </tr>
  <tr>
    <td colspan="3" align="right">Jumlah Total </td>
    <td><input name="jt" type="text" id="jt" value="0" readonly="true" /></td>
  </tr>
  <tr>
    <td colspan="3" align="right">Diskon</td>
    <td><input name="dsc" type="text" id="dsc" value="0" readonly="true" /></td>
  </tr>
  <tr>
    <td colspan="3" align="right">Jimlah Dibayar </td>
    <td><input name="bayar" type="text" id="bayar" value="0" readonly="true" /></td>
  </tr>
</table>
<br>
<input type="submit" name="Submit" value="Batal" onclick="rst()" />
</form>
</body>
</html>
Read more!

Membuat Calculator #1

Membuat Calculator #1









<!DOCTYPE html>
<html lang="en">

<head>
<title>Hitung</title>
</head>
<body>

<script language="JavaScript" type="text/javascript">

<!--
function hitung(){
  var mf=document.form1;

  if (mf.op.value == "+")
    mf.bil3.value=parseFloat(mf.bil1.value) + parseFloat(mf.bil2.value);
  else if (mf.op.value == "-")
    mf.bil3.value=parseFloat(mf.bil1.value) - parseFloat(mf.bil2.value);
  else if (mf.op.value == "*")
    mf.bil3.value=parseFloat(mf.bil1.value) * parseFloat(mf.bil2.value);
  else
    mf.bil3.value=parseFloat(mf.bil1.value) / parseFloat(mf.bil2.value);
}
//-->
</script>

<form name=form1 action="#">
<input type=text name=bil1>

<select name="op">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>

<input type=text name=bil2>

<input type="button" value="=" onClick="hitung()" />

<input type=text name=bil3>

</form>
</body>
</html>

Read more!

Kasus 4

Membuat layout sederhana...


HTML

<! DOCTYPW html>
<html lang="en">

<head>
<title>Studi Kasus</title>
<link rel="stylesheet" href="style.css" type=text/css />
</head>
<body>
<header>Header...</header>

<nav>
<button>button 1</button>
<button>button 2</button>
<button>button 3</button>
<button>button 4</button>

Nav...</nav>

<section>

<article>Article...</article>
<aside>Aside...</aside>

Section...</section>

<footer>Footer...</footer>

</body>
</html>

--------

file css

body{
  margin:1px auto;
  width:750px;
  border:1px solid green;
}

header,nav,section,article,aside,footer{
  display:block;
}

header{
  height:80px;
  border:1px solid green;
}

nav{
  width:730px;
  height:25;
  border:1px solid blue;
  padding:10px 10px 10px 10px;
}
section{
  clear:both;
  width:750px;
  height:450px;
  border:1px solid red;
}

article{
  margin:20px;
  float:left;
  width:450px;
  height:370px;
  border:1px dashed red;
}

aside{
  margin:20px;
  float:right;
  width:200px;
  height:370px;
  border:1px dashed black;
}

footer{
  clear:both;
  height:20px;
  border:1px solid green;
}

button -input{
  width:75;
  height:25px;
  border:1px solid red;
}
Read more!

Sabtu, 12 Februari 2011

Praktikum 1 (Modul 2 - Tugas Rumah 2)

Screen Shoot :


Syntax :
<!DOCTYPE HTML>
<html lang="en">
<head>
<title>Perbandingan Sikap</title>
</head>
<body>
<table width="600" border="1" cellpadding="0" cellspacing="0" align="center" >
  <caption>
  <b>PERBANDINGAN SIKAP</b>
  </caption>
  <tr>
    <th width="5%">No.</th>
    <th width="25%">Spesifikasi Sikap </th>
    <th width="10%">Poin</th>
    <th width="15%">Herlambang</th>
    <th width="15%">Nidhom</th>
    <th width="15%">Bian</th>
    <th width="15%">Sony</th>
  </tr>
  <tr>
    <td>
      1.<br>
      2.<br>
      3.<br>
      4.<br>
      5.</td>
    <td>
      Kerja keras<br>
      Tekun<br>
      Tidak sombong<br>
      Sabar<br>
      Pemaaf<br></td>
    <td>
      8<br>
      9<br>
      6<br>
      7<br>
      10</td>
    <td align="center">
      x<br>
      x<br>
      x<br>
      x<br>
      x</td>
    <td align="center">
      x<br>
      x<br>
      -<br>
      -<br>-</td>
    <td align="center">
      -<br>
      x<br>
      -<br>
      -<br>
      -<br>
      x</td>
    <td align="center">
      -<br>
      -<br>
      -<br>
      -<br>
      -</td>
  </tr>
  <tr>
    <td>
      6.<br>
      7.<br>
      8.<br>
      9.<br>
      10</td>
    <td>
      Pemalas<br>
      Ceroboh<br>
      Tinggi hati<br>
      Pendendam<br>
      Kurang vitamin</td>
    <td>
      -5<br>
      -3<br>
      -7<br>
      -10<br>
      -11</td>
    <td align="center">
      -<br>
      -<br>
      -<br>
      -<br>
      -</td>
    <td align="center">
      -<br>
      -<br>
      x<br>
      x<br>
      x</td>
    <td align="center">
      x<br>
      x<br>
      -<br>
      x<br>
      -</td>
    <td align="center">
      x<br>
      x<br>
      x<br>
      x<br>
      x</td>
  </tr>
  <tr>
    <td colspan="3" align="center"><b>Jumlah Poin</b></center></td>
    <td align="center">40</td>
    <td align="center">-11</td>
    <td align="center">1</td>
    <td align="center">-36</td>
  </tr>
</table>

<table width="600" border="0" align="center">
  <tr>
    <td>
      <i>Source : Forbes Magazine - February, 2011</i><br>
      &copy;ADH
    </td>
</tr>
</table>
</body>
</html> Read more!

Praktikum 1 (Modul 2 - Tugas Rumah)

Screen Shoot :

Syntax :
<!DOCTYPE HTML>
<html lang="en">
<head>
<title>GRAFIK HASIL TEST SD NEGERI PENDTIUM</title>
</head>
<body>
<table width="800" border="0" cellpadding="0" cellspacing="0" align="center">
<caption>
<b>GRAFIK HASIL TEST SD NEGERI PENDTIUM</b>
</caption>
  <tr>
    <th width="30">100</td>
    <th width="20" bgcolor="#000000"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
    <th width="30"></th>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#000000"></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#000000"></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#000000"></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#000000"></td>
    <td></td>
    <td></td>
    <td rowspan="16" bgcolor="#0000FF"></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#000000"></td>
    <td></td>
    <td rowspan="15" bgcolor="#FF0000"></td>
    <td rowspan="15" bgcolor="#00FF00"></td>
    <td></td>
    <td rowspan="15" bgcolor="#00FFFF"></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#000000"></td>
    <td></td>
    <td rowspan="14" bgcolor="#FFFF00"></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#000000"></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#000000"></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#000000"></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>50</td>
    <td bgcolor="#000000"></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#000000"></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#000000"></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#000000"></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#000000"></td>
    <td></td>
    <td></td>
    <td rowspan="6" bgcolor="#FF0000"></td>
    <td></td>
    <td></td>
    <td></td>
    <td rowspan="6" bgcolor="#00FFFF"></td>
    <td></td>
    <td></td>
    <td rowspan="6" bgcolor="#0000FF"></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td rowspan="6" bgcolor="#00FFFF"></td>
    <td></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#000000"></td>
    <td></td>
    <td></td>
    <td rowspan="5" bgcolor="#0000FF"></td>
    <td></td>
    <td rowspan="5" bgcolor="#FFFF00"></td>
    <td></td>
    <td></td>
    <td rowspan="5" bgcolor="#00FF00"></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td rowspan="5" bgcolor="#00FF00"></td>
    <td rowspan="5" bgcolor="#FFFF00"></td>
    <td></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#000000"></td>
    <td></td>
    <td></td>
    <td rowspan="4" bgcolor="#00FF00"></td>
    <td></td>
    <td></td>
    <td rowspan="4" bgcolor="#FFFF00"></td>
    <td></td>
    <td></td>
    <td rowspan="4" bgcolor="#FF0000"></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#000000"></td>
    <td></td>
    <td></td>
    <td></td>
    <td rowspan="3" bgcolor="#FF0000"></td>
    <td></td>
    <td></td>
    <td rowspan="3" bgcolor="#0000FF"></td>
    <td></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#000000"></td>
    <td></td>
    <td></td>
    <td></td>
    <td rowspan="2" bgcolor="#00FFFF"></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#000000"></td>
    <td></th>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>0</td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
    <td bgcolor="#000000"></td>
  </tr>
  <tr>
    <td></td>
    <td></td>
    <td></td>
    <td colspan="5"><center>
      <b>Herlambang</b>
    </center></td>
    <td></td>
    <td colspan="5"><center>
      <b>Nidhom</b>
    </center></td>
    <td></td>
    <td colspan="5"><center>
      <b>Bian</b>
    </center></td>
    <td></td>
    <td colspan="5"><center>
      <b>Sony</b>
    </center></td>
    <td></td>
  </tr>
</table>
<br><br>

<table width="800" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <th width="25"></td>
    <th width="25"></th>
    <th width="25"></th>
    <th width="25"></th>
    <th width="700"></th>
  </tr>
  <tr>
    <td colspan="3">Keterangan</td>
    <td width="25">:</td>
    <td width="25"></td>
  </tr>
  <tr>
    <td width="25">&nbsp;</td>
    <td width="25"></td>
    <td width="25"></td>
    <td></td>
    <td></td>
   
  </tr>
  <tr>
    <td colspan="2" bgcolor="#FF0000"></td>
    <td></td>
    <td>:</td>
    <td colspan="5"><i>kemampuan membaca </i></td>
   
  </tr>
  <tr>
    <td colspan="2" bgcolor="#0000FF"></td>
    <td></td>
    <td>:</td>
    <td colspan="5"><i>kemampuan menulis </i></td>
   
  </tr>
  <tr>
    <td colspan="2" bgcolor="#00FF00"></td>
    <td></td>
    <td>:</td>
    <td colspan="5"><i>kemempuan mendengar</i></td>
   
  </tr>
  <tr>
    <td colspan="2" bgcolor="#FFFF00"></td>
    <td></td>
    <td>:</td>
    <td colspan="5"><i>kemampuan berbicara </i></td>
   
  </tr>
  <tr>
    <td colspan="2" bgcolor="#00FFFF"></td>
    <td></td>
    <td>:</td>
    <td colspan="5"><i>kemampuan menggambar </i></td>
   
  </tr>
</table>
<p align="center"></p>
</body>
</html> Read more!

Praktikum 1 (Modul 2 - Studi Kasus)

Screen Soot 1 :

Syntax 1 :
<!DOCTYPE HTML>
<html lang="en">
<head>
<title> JPS Kaius 2 </title>
</head>
<body>
<table border=0 align="center" cellspacing=0 cellpadding=0 bgcolor="green">
  <caption>
  <b>Download Data</b>
  </caption>
  <tr>
    <th width=5 bgcolor="lightgreen"></th>
    <th width=5 bgcolor="white"></th>
    <th width=200 bgcolor="green"><a href="kasus2_1.html">Film</a></th>
    <th width=10 bgcolor="white"> </th>
    <th width=200 bgcolor="lightgreen"><a href="kasus2_2.html">Dokumen</a></th>
    <th width=10 bgcolor="white"> </th>
    <th width=200 bgcolor="lightgreen"><a href="kasus2_3.html">Music</a></th>
    <th width=5 bgcolor="white"></th>
    <th width=5 bgcolor="lightgreen"></th>
  </tr>
 
  <tr>
    <td bgcolor="lightgreen"></td>
    <td colspan=7>
      <ol>
        <li><a href="film/Indowebster Dota Song.flv">Indowebster Dota Song.flv</a></li>
        <li><a href="film/Rujak Toon 1.flv">Rujak Toon 1.flv</a></li>
        <li><a href="film/Rujak Toon 2.flv">Rujak Toon 2.flv</a></li>
        <li><a href="film/Yolanda Be Cool Vrs DCup - We No Speak Americano.flv">Yolanda Be Cool Vrs DCup - We No Speak Americano.flv</a></li>
      </ol>
    </td>
    <td bgcolor="lightgreen"></td>
  </tr>
 
  <tr>
    <td colspan=9 bgcolor="lightgreen" align="center">
    <font size=2 color="darkblue">&copy; Dj_AK47 2011</font>
    </td>
  </tr>
</table>
</body>
</html>



Screen Soot 2 :
Syntax 2 :

<!DOCTYPE HTML>
<html lang="en">
<head>
<title> JPS Kaius 2 </title>
</head>
<body>
<table border=0 align="center" cellspacing=0 cellpadding=0 bgcolor="green">
  <caption>
  <b>Download Data</b>
  </caption>
  <tr>
    <th width=5 bgcolor="lightgreen"></th>
    <th width=5 bgcolor="white"></th>
    <th width=200 bgcolor="lightgreen"><a href="kasus2_1.html">Film</a></th>
    <th width=10 bgcolor="white"> </th>
    <th width=200 bgcolor="green"><a href="kasus2_2.html">Dokumen</a></th>
    <th width=10 bgcolor="white"> </th>
    <th width=200 bgcolor="lightgreen"><a href="kasus2_3.html">Music</a></th>
    <th width=5 bgcolor="white"></th>
    <th width=5 bgcolor="lightgreen"></th>
  </tr>
 
  <tr>
    <td bgcolor="lightgreen"></td>
    <td colspan=7>
      <ol>
        <li><a href="doc/Modul 1 Dasar-dasar HTML v2.0.pdf">Modul 1 Dasar-dasar HTML v2.0.pdf</a></li>
        <li><a href="doc/Modul 2 Komponen HTML Lanjut v2.0.pdf">Modul 2 Komponen HTML Lanjut v2.0.pdf</a></li>
      </ol>
    </td>
    <td bgcolor="lightgreen"></td>
  </tr>
 
  <tr>
    <td colspan=9 bgcolor="lightgreen" align="center">
    <font size=2 color="darkblue">&copy; Dj_AK47 2011</font>
    </td>
  </tr>
</table>
</body>
</html>



Screen Soot 3 :

Syntax 3 :
<!DOCTYPE HTML>
<html lang="en">
<head>
<title> JPS Kaius 2 </title>
</head>
<body>
<table border=0 align="center" cellspacing=0 cellpadding=0 bgcolor="green">
  <caption>
  <b>Download Data</b>
  </caption>
  <tr>
    <th width=5 bgcolor="lightgreen"></th>
    <th width=5 bgcolor="white"></th>
    <th width=200 bgcolor="lightgreen"><a href="kasus2_1.html">Film</a></th>
    <th width=10 bgcolor="white"> </th>
    <th width=200 bgcolor="lightgreen"><a href="kasus2_2.html">Dokumen</a></th>
    <th width=10 bgcolor="white"> </th>
    <th width=200 bgcolor="green"><a href="kasus2_3.html">Music</a></th>
    <th width=5 bgcolor="white"></th>
    <th width=5 bgcolor="lightgreen"></th>
  </tr>
 
  <tr>
    <td bgcolor="lightgreen"></td>
    <td colspan=7 bgcolor="green">
      <ol>
        <li><a href="music/Technicolour - Paloma Faith.mp3">Technicolour - Paloma Faith.mp3</a></li>
        <li><a href="music/DJ Tiesto Traffic.mp3">DJ Tiesto Traffic.mp3</a></li>
        <li><a href="music/Duskahaniyaan club02.mp3">Duskahaniyaan club02.mp3</a></li>
        <li><a href="music/Vampire Knight.mp3">Vampire Knight.mp3</a></li>
      </ol>
    </td>
    <td bgcolor="lightgreen"></td>
  </tr>
 
  <tr>
    <td colspan=9 bgcolor="lightgreen" align="center">
    <font size=2 color="darkblue">&copy; Dj_AK47 2011</font>
    </td>
  </tr>
</table>
</body>
</html> Read more!

Praktikum 1 (Modul 1 - Studi Kasus)

 Print Out :

Syntax :
<!DOCTYPE HTML>
<html lang="en">
<head>
  <link rel="shortcut icon" href="image/bg.png">
  <title> JPS Kaius 1 </title>
</head>
<body background="image/bg.png">
<font color="darkred"><h1> Selamat Datang Di WEB DJ_AK47</h1></font>
<hr color="silver" size="10">
<img src="image/kucing.jpg" atl="kucing saya" width=120 height=100><br>
<font color="magenta"><strong>Ini merupakan web studi kasus petama kucing saya yang berisi identitas :</strong></font>
<font color="darkblue" ><b>
<ol>
<li><pre>NIM   : 109533427364              </pre></li>
<li><pre>Nama  : Kucing Belang rasa kuning </pre></li>
<li><pre>Umur  : 6 bln                     </pre></li>
</ol>
</b></font>
<hr color="magenta" size="5" width="200" align="left">
<hr color="red" size="5">
</body>
</html> Read more!