Senin, 07 Maret 2011


Berikut adalah Script dari Tampilan diatas :

<!DOCTYPE html>
<html lang="en">
<head>
<title>Face-Loriezza</title>

<style type="text/css">

.header, .footer{
background-color : #b70303;
}

.header{
height : 100px;
padding-top : 10px;
padding-bottom : 10px;
padding-left : 150px;
}

#lebar{
width : 1000px;
}

.footer{
padding-top : 5px;
padding-bottom : 5px;
padding-right : 200px;
padding-left : 30px;
color : white;
font-family : Tahoma;
font-size : small;
font-weight : bold;
}

.bg-color{
height : 410px;
background-image : url(bg.jpg);
background-color : white;
background-repeat : repeat-x;
}


.login{
float : right;
color : white;
font-family : arial;
font-size : small;
}

#logo{
margin-top : 10px;
float : left;
height : 35px;
}

#kanan{
float: left;
padding: 5px;
width:450px;
height: 360px;
}

#tengah {
float: left;
}

#kiri {
float: left;
width: 760px;
height: 360px;
}

#imageface{
padding-top : 10px;
padding-bottom : 10px;
padding-left : 50px;
width: 400px;
height: 200px;
font-family :  Pristina;
font-weight : bold;
color: #cf0707;
}

#huruf{
font-family : Papyrus;
font-size : small;
font-weight : bold;
line-height : 40px;
color: #792323;
}

#klik_in{
background-color : #870b0b;
color : white;
}

#button_daftar{
background-color : #870b0b;
color : white;
}

</style>

</head>
<body>
<div class="header">
<div id="lebar">
<div id="logo">
<img src="face.jpg" height="100">
</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="klik_in"></td>
</tr>
<tr>
<td height="25"><input type="checkbox" checked>Ingat...</td>
<td height="25">Lupa kata sandi???(kasihan)</td>
<td height="25"> </td>
</tr>
</table>
</div>
</div>
</div>
<div class="bg-color">

<form>
<div id="tengah">
<div id="kiri">
<div id="imageface">
<font size="3">Face-Loriezza Just for Praktikum B P W Modul 3 </font>
<img src="ducati.jpg">
</div>
</div>
</div>
</form>
<div id="kanan">
<div id="huruf">
<h2>Akun Face-Loriezza GET FREE. </h2>
<hr style="color: red">
<form>
<table>
<tr>
<td>Nama Depan :</td>
<td><input type="text" size="40"></td>
</tr>
<tr>
<td>Nama Belakang :</td>
<td><input type="text" size="40"></td>
</tr>
<tr>
<td>Email :</td>
<td><input type="text" size="40"></td>
</tr>
<tr>
<td>Password Baru:</td>
<td><input type="password" size="40"></td>
</tr>
<tr>
<td>Ulangi Password :</td>
<td><input type="password" size="40"></td>
</tr>
<tr>
<td>Jenis Kelamin :</td>
<td><select name="kelamin">
<option value="pria" selected>Laki-laki
<option value="wanita">Perempuan
</select></td>
</tr>
</table>
</form>
<input type="submit" value="Get Now" id="button_daftar">
</div>
</div>
</div>
<div class="footer">
Created by : Smpl t perfect
<br>
Supported by : Ps CS5<br/>
</div>
</body>
</html>

Tidak ada komentar:

Posting Komentar