Skip to content

tgs modul 3 facemu

February 23, 2011

<!DOCTYPE html>
<html lang=”id”>
<head>
<title>Selamat Datang di Face-mu – Masuk, Daftar, atau Pelajari Selengkapnya</title>
<link rel=”shortcut icon” href=”images/icon.png”>
<!– –>
<style type=”text/css”>
<!–

body{
font-family:Arial;
font-size:11px;
color:#333;
margin:0;
padding:0;
text-align:left;
overflow-y:scroll
}
.body-tab{
margin:0 auto 0 auto;
width:950px;
}
.stBack {
background-image:url(images/bg.jpg);
width: 100%;
height: 500px;
}
.stHeader {
width:950px;
height:75px;
}
.stHeaderBack {
width:100%;
height:75px;
background-color: #3B5998;
}
.stFooter {
clear:both;
width:100%;
height:20px;
background-color: #3B5998;

}
.stFooter .font-tab{
padding-top:2px;
color:#FFFFFF;
font-family:Arial;
font-size:11px;
padding-left: 15px;
}
.stLogo {
width:250px;
margin-top: 25px;
float:left;
}
.stLogin {
margin-top:10px;
width:420px;
float:right;
}
.stCenter {
width:950px;
height:425px;
}
.stLabelInputDaftar {
height:27px;
font-family:Arial;
font-size:12px;
color:#3B5998;
padding-top:7px;
}
.stLabelInputDaftarNoPadding {
height:34px;
font-family:Arial;
font-size:12px;
color:#3B5998;
}
.stTxtLogin {
width:150px;
border:1px solid black;
}
.stTxtDaftar {
width:200px;
height:24px;
border:1px solid #6483C4;
}
.stSelDaftar {
border:1px solid #6483C4;
}
.stBtn {
border:1px solid #999;
border-bottom-color:#888;
box-shadow:0 1px 0 rgba(0, 0, 0, .1);
-moz-box-shadow:0 1px 0 rgba(0, 0, 0, .1);
cursor:pointer;
display:-moz-inline-box;
display:inline-block;
font-size:11px;
font-weight:normal;
line-height:normal !important;
padding:2px 6px;
text-align:center;
text-decoration:none;
color:#FFFFFF;
vertical-align:top;
white-space:nowrap;

}
.bt1{
background-color:#6483C4;
background-position:0 -96px;
border-color:#CCCCCC #6483C4 #6483C4 #CCCCCC;
}
.bt2{
background-color:#69a74e;
background-position:0 -96px;
border-color:#3b6e22 #3b6e22 #2c5115;
width:150px;
height:26px;
font-weight:bold
}
.ftHeader{
color:#FFFFFF;
font-family:Arial;
font-size:12px;
}
.ftHeaderSmall{
color:#FFFFFF;
font-family:Arial;
font-size:9px;
}
.ftHome1 {
font-family: Arial;
font-size: 26px;
font-weight: bold;
color: #3B5998;
}
.ftHome2 {
font-family: Arial;
font-size: 15px;
color: #3B5998;
}
.ftHome3 {
height: 37px;
font-family: Arial;
font-size: 10px;
color: #3B5998;
}
.ftHome4 {
color: #000000;
font-family: Arial;
font-size: 10px;
}
.ftHome5 {
font-size: 18px
}

–>
</style>
</head>

<body>
<div>
<div>
<div>

<!– buat login –>
<div>
<div><img src=”images/facemu.png” alt=”face-mu” width=”151″ height=”34″ /></div>
<div>
<div style=”width:170px; float:left”>
<div style=”height:15px”>Email:</div>
<div><input type=”text” id=”txtUserId” tabindex=”1″ />
</div>
<div style=”height:20px; padding-top:3px; float:left”><input type=”checkbox” id=”chboxStayLoggedIn” checked=”checked” tabindex=”3″ /></div>
<div style=”padding-top:4px”><span>Biarkan saya tetap masuk</span> </div>
</div>
<div style=”float:left; width:170px”>
<div style=”height:15px”>Password:</div>
<div><input type=”password” id=”txtUserPass” tabindex=”2″ />
</div>
<div style=”padding-top:4px”><a href=”#” style=”text-decoration:none”><span>Lupa kata sandi Anda?</span></a></div>
</div>
<div style=”float:left”>
<div style=”height:15px”></div>
<div>
<input type=”button” id=”btnLogin” tabindex=”4″ value=”Masuk”  />
</div>
</div>
</div>
</div>
<!– akhir header –>

<!– kode center section –>
<div>
<div style=”width:550px; height:425px; float:left”>
<br />
<p><strong>Face-mu membantu Anda terhubung dan berbagi<br />
dengan orang-orang dalam kehidupan Anda di<br />
Indonesia    </strong></p>
<p><img src=”images/pulau.png” width=”474″ height=”195″ /></p>
</div>
<!– form daftar –>
<div style=”width:335px; height:425px; float:left”>
<br />
<span>Mendaftar</span><br />
<span>Gratis, sampai kapanpun</span>
<hr style=”color:#3B5998″ />
<div style=”width:120px; float:left”>
<div>Nama Depan</div>
<div>Nama Belakang</div>
<div>Email Anda</div>
<div>Masukkan Ulang Email</div>
<div>Kata Sandi</div>
<div>Saya Seorang</div>
<div>Tanggal Lahir</div>
</div>
<div style=”width:10px; float:left”>
<div>:</div>
<div>:</div>
<div>:</div>
<div>:</div>
<div>:</div>
<div>:</div>
<div>:</div>
</div>
<div style=”width:200px; float:left”>
<div>
<input type=”text” id=”txtNamaDepan” />
</div>
<div>
<input type=”text” id=”txtNamaBelakang” />
</div>
<div>
<input type=”text” id=”txtEmail” />
</div>
<div>
<input type=”text” id=”txtReEmail” />
</div>
<div>
<input type=”password” id=”txtPassword” />
</div>
<div>
<span>
<select id=”selJeKel” >
<option>Jenis Kelamin</option>
</select>
</span></div>
<div>
<select id=”selTglLahir” >
<option>Tgl</option>
</select>
<select id=”selBlnLahir” >
<option>Bulan</option>
</select>
<select id=”selThnLahir” >
<option>Tahun</option>
</select>
<br />
<a href=”#” style=”text-decoration:none”><span>Mengapa saya perlu mengisinya?</span></a> </div>
</div>
<div style=”clear:both; text-align:center; padding-top:3px”><input type=”button” id=”btnDaftar” value=”   Mendaftar   ”  />
<hr style=”color:#3B5998″ />
<a href=”#” style=”text-decoration:none”><strong>Buat halaman</strong></a> <strong>untuk selebritis, grup musik, atau bisnis</strong></div>
</div>
<!– akhir kode form daftar –>
</div>
<!– akhir kode center section –>

</div>
</div>
<div style=”height:425px”>
</div>

<!– awal kode footer –>
<div>
<div>Tugas M. Zuari Antoni Arip (100533406915) </div>
</div>
<!– akhir kode footer –>

</div>
</body>
</html>

No comments yet

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: