Script pertama simpan dengan nama design.css
#header {
height : 80px;
background: #3366cc;
font-family: times new roman;
font-size:14px;
color: white;
}
#logo{
padding: 30px 400px 20px 200px;
float: left;
}
#footer{
padding: 20px;
background: #3366cc;
height:40px;
clear:both;
font-family: arial;
color: white;
font-size:12px
}
#isi{
float:left;
height : 430px;
weight : 100%;
background-image: URL(bg.jpg);
}
#isi-huruf{
float:left;
padding: 51px 0px 50px 360px;
font-family: arial;
color: #3366cc;
}
#isi-textbox{
float:left;
padding : 106px 50px 100px 0px;
font-family: arial;
color : #3366cc;
}
#peta{
float: left;
padding: 50px 50px 0px 50px;
font-family: arial;
font-weight: bold;
color: #3366cc;
width: 500px;
}
#tabel{
padding-top:20px;
padding-right:200px;
float:right;}
Script kedua simpan dengan nama face.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>face-mu</title>
<link rel="shortcut icon" href="icon.png"/>
<link rel="stylesheet" href="design.css" type="text/css"/>
</head>
<body>
<div id="header">
<div id="logo"><img src="facemu.png"/></div>
<div id="table">
<table>
<tr>
<td><b>Email :</b></td>
<td></td>
<td><b>Password :</b></td>
</tr>
<tr>
<td>
<input type="text" >
</td>
<td></td>
<td>
<input type="password" >
</td>
<td><input id="bgbutton" type="button" maxlength=10 value="MASUK"></td>
</tr>
<tr>
<td><input type="checkbox" checked>Biarkan saya tetap masuk</td>
<td></td>
<td>Lupa Password ? </td>
</tr>
</table>
</div>
</div>
<div id="isi">
<div id="peta">
Face-Mu membantu anda terhubung dan berbagi dengan orang-orang dalam kehidupan anda di Indonesia
<img src="PETA.png"/>
</div>
<div id="isi-huruf" >
<br />
<font size="5"><b>Mendaftar</b></font><br />
Gratis sampai kapanpun<br />
<hr />
<br />
<div>Nama Depan</div><br />
<div>Nama Belakang</div><br />
<div>Email Anda</div><br />
<div>Kata Sandi</div><br />
</div>
<div id="isi-textbox">
<br />
<br />
<div>: <input type=”text”></div><br />
<div>: <input type=”text”></div><br />
<div>: <input type=”text”></div><br />
<div>: <input type=”text”></div><br />
</div>
</div>
<br />
<br />
<br />
<div id="footer" align="center">© tiffanymarta.com
</div>
</body>
</html>
Printscreen
Tidak ada komentar:
Posting Komentar