Minggu, 20 Februari 2011

MODUL 3 - TUGAS PRAKTIKUM



script :


<!DOCTYPE html>
<html lang="en">
<head>
<title>Welcome to face-mu</title>
<link type="icon" rel="icon" href="icon.png">

<style type="text/css">
.header{
height : 75px;
padding-top : 10px;
padding-bottom : 10px;
padding-left : 150px;
background-color:black;
}
#tengah{
padding-top : 10px;
padding-bottom : 10px;
padding-left : 150px;
width: 400px;
height: 200px;
font-family : Comic Sans MS;
font-size : small;
font-weight : bold;
color: black;
}
.footer{
padding-top : 5px;
padding-bottom : 5px;
padding-right : 200px;
padding-left : 30px;
color : white;
font-family : Comic Sans MS;
font-size : small;
background-color:black;
}
#button_masuk , #button_daftar{
background-color : black;
color : white;
}
#lebar{
width : 1000px;
}
.background{
height : 480px;
background-image : url(bg.bmp);
background-color : white;
background-repeat : repeat-x;
}
.login{
float : right;
color : white;
font-family : Comic Sans MS;
font-size : small;
}
#kiri {
padding: 5px;
float: left;
width: 780px;
height: 480px;
}
#kanan{
float: left;
padding: 5px;
width:500px;
height: 480px;
}
#font{
font-family : Comic Sans MS;
font-size : small;
font-weight : bold;
line-height : 30px;
color: black;
}
#logo{
float : left;
margin-top : 20px;
height : 35px;
}

</style>
</head>

<body>
<div class="header">
<div id="lebar">
<div id="logo">
<img src="facemu.png">
</div>
<div class="login">
<table>
<tr>
<td>Email</td>
<td>Password</td>
<td></td>
</tr>

<tr>
<td ><input type="text"></td>
<td ><input type="password"></td>
<td ><input type="submit" value="Masuk" id="button_masuk"></td>
</tr>

<tr>
<td ><input type="checkbox" checked>Ingat password</td>
<td >Lupa password ?</td>
</tr>
</table>
</div>
</div>
</div>

<div class="background">
<form action="my_action.jsp">
<div id="kiri">
<div id="tengah">
<font size="4">PERAWATAN DAN PERBAIKAN WAJAH<br></font>
<hr style="color:black" width="450">
<img src="wajah.png">
<hr style="color:black" width="450">
<font size="3">Wajah Anda Bermasalah ? <br>
Segera daftarkan wajah anda</font>
</div>
</div>

</form>
<div id="kanan">
<div id="font">
<h2>Silahkan Registrasi wajah anda </h2>

<form action="my_action.jsp">
<table>
<tr>
<td>Nama Depan :</td>
<td><input type="text" size="35"></td>
</tr>
<tr>
<td>Nama Belakang :</td>
<td><input type="text" size="35"></td>
</tr>
<tr>
<td>Email :</td>
<td><input type="text" size="35"></td>
</tr>
<tr>
<td>Password:</td>
<td><input type="password" size="35"></td>
</tr>
<tr>
<td>Ulangi Password:</td>
<td><input type="password" size="35"></td>
</tr>
<tr>
<td>Jenis Kelamin :</td>
<td><select name="kelamin">
<option >Laki-laki
<option >Perempuan
<option >Maho
</select></td>
</tr>
</table>
</form>
<input type="submit" value="Daftarkan wajah" id="button_daftar">
</div>
</div>
</div>
<div class="footer">
&copy;face-mu 2011
</div>
</body>
</html>

2 komentar: