index.html
<head>
<style>
body{
background-color:#BFBFBF;
font-family:verdana,Lucida, Tahoma,Century gothic, sans-serif;
font-size: 13px;
}
.rai {
background-color: #C3C4C4;
width: 370px;
padding: 9px 35px 35px 35px;
border-radius: 11px;
margin: auto;
margin-top:180px;
border: 1px solid #EEE;
-moz-box-shadow: 0px 0px 25px black;
-webkit-box-shadow: 0px 0px 25px;
}
.ribbon {
margin-top: -17px;
width: 38px;
float: right;
text-align: center;
padding: 10px 0;
}
table{
font-size: 12px;
}
tr {
vertical-align: top;
}
</style>
</head>
<body>
<div class='rai'>
<div class='ribbon'><img src='gunadarma.png' style='width:36px'></div>
<h3 style="border-bottom: 3px solid rgb(130, 130, 130);">IDENTITAS DIRI</h3>
<img src="image.jpg" style="width: 60px;float: right;margin-right: 14px;"/>
<div>
<table>
<tr><td>Nama </td><td>:</td><td style="width: 56%;">Raipeza</td></tr>
<tr><td>Jenis kelamin </td><td>:</td><td>Laki-laki</td></tr>
<tr><td>Kewarganegaraan </td><td>:</td><td>Indonesia</td></tr>
<tr><td>Alamat </td><td>:</td><td>Jl.Margonda Raya<br/> Depok</td></tr>
<tr><td>E-mail </td><td>:</td><td>raipeza24@gmail.com</td></tr>
</tr>
</table>
<a href='tentang.html' title='Halaman Berikutnya'><img src='panah_next.png' style="width: 31px;float: right;"></a>
</div>
</div>
</div>
</body>
<!--RAIPEZA 4KA01 2013-->
tentang.html
<head>
<style>
body{
background-color:#BFBFBF;
font-family:verdana,Arial, Tahoma,Century gothic, sans-serif;
font-size: 12px;
}
.rai {
background-color: #C3C4C4;
width: 370px;
padding: 9px 35px 35px 35px;
border-radius: 11px;
margin: auto;
margin-top:180px;
border: 1px solid #EEE;
-moz-box-shadow: 0px 0px 25px black;
-webkit-box-shadow: 0px 0px 25px;
}
.ribbon {
margin-top: -17px;
width: 38px;
float: right;
text-align: center;
padding: 10px 0;
}
table{
font-size: 12px;
}
</style>
</head>
<body>
<div class='rai'>
<div class='ribbon'><img src='gunadarma.png' style='width:36px'></div>
<h3 style="border-bottom: 3px solid rgb(146, 146, 146);">TENTANG SAYA</h3>
<div style='text-align:justify;'>
<p>
Nama lengkap saya adalah Raipeza. Hobi saya adalah membaca manga, dan futsal
<p/><p>
Saya berasal dari anak pertama dari 5 bersaudara, saya berasal dari Lampung
<p/><p>
Alasan saya memilih Universitas Gundarma didasarkan kepada minat saya terhadap bidang komputer. Oleh karena itu, Universitas Gundarma adalah satu-satunya pilihan universitas yang saya tuju.
</p>
<a href='index.html' title='Halaman Sebelumnya'><img src='panah_balik.png' style="width: 31px;float: right;"></a>
</div>
</div>
</body>
<!--RAIPEZA 4KA01 2013-->
Penjelasan dari codingan di atas adalah
Pada ( head)(style)(head)(style) : kodingnya menjelaskan tentang pembuatan warna background, jenis huruf , warna, dan letaknya
Pada (body)(body): kodingnya menjelaskan tentang pembuatan judul yaitu biodata, serta nama, jenis kelamin, kewarganergaraan, alamr, dan e-mail.
Pada koding (a href='page2.html' title='Next' mg src='arrow_next.png' style="width: 31px;float: right;a) berfungsi sebagai link untuk pindah ke page2.html
Pada (mg src="image.jpg" style="width: 60px;float: right;margin-right: 14px)berfungsi untuk memunculkan gambar pada web)
berikut tampilan printscreen hasilnya
Catatan:-semua gambar (image) berada pada folder yang sama dengan codingannya
0 komentar:
Posting Komentar