anda bisa merubah codingannya sesuai apa yang anda inginkan...
sebelumnya anda harus sudah instal Notepad++
Coding Home : ( Save dengan nama indeks format html )
untuk image background & di ucapan selamat datang anda bisa pilih gambar yang anda sukai,
gambar harus di letakan satu folder dengan semuah file codingan website offline ini ...
kemudian buat css nya dengan nama style.css
coding style.css :
.wrap{
background: yellow;
width: 900px;
margin: 10px auto;
}
/*bagian header*/
.wrap .header{
background: green;
/*height: 50px;*/
padding: 2px 10px;
}
/*akhir header*/
/*bagian menu*/
.wrap .menu{
background: black;
}
.wrap .menu ul{
padding: 0;
margin: 0;
background: black;
overflow: hidden;
}
.wrap .menu ul li{
float: left;
list-style-type: none;
padding: 10px;
}
/*akhir menu*/
.clear{
clear: both;
}
.badan{
height: 590px;
}
/*bagian sidebar*/
.wrap .badan .sidebar{
background: yellow;
float: left;
width: 25%;
height: 100%;
}
/*akhir sidebar*/
.wrap .badan .content{
background: white;
float: left;
height: 100%;
width: 75%;
}
<<<===========================================================>>>
coding biodata (disini saya langsung menggunakan image/foto untuk biodata jadi hanya dipanggil saja)
<<<===============================================>>>
coding untuk contact person (format html):
<!DOCTYPE html PUBLIC "_//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org//TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<body background="d:\tgs2_webpro_ardiansyah.a_14090058\man utd 1.jpg">
<div class="wrap">
<div class="header">
<h1>PECINTA DUNIA IT</h1>
<p>WEB PROGRAMMING 1</p>
</div>
<div class="menu">
<ul>
<li><a href="home.html"target=blank>Home</a></li>
<td><div align="center"><li><a href="biodata saya.html"target=blank>Profile</a>
<td><div align="center"><li><a href="Contact Person.html"target=blank>Contact Person</a>
<li><a href="SKS Prodi D4-Teknik Informatika.html"target=blank>SKS Prodi D4-Teknik Informatika</a></li>
</ul>
</div>
<div class="badan">
<div class="CONTACT PERSON">
<td><div align="center">CONTACT PERSON
<p><br><tr>
<td><b>E-Mail</b></td>
<td><div align="center"> <br><li><a href="ardiansyah_agustinanda@yahoo.com"> Yahoo </br> <br><li><a href="ardiansyahagustinanda@gmail.com"> Gmail </br></td>
</p>
</br>
</tr>
<p>
<tr>
<td><br>No.Hp</br></td>
<td><div align="center"> 085728159574</td>
</p>
</tr>
<tr>
</tr>
<p>
<br>
<tr>
<td><b>Sosmed</b></td>
<td><div align="center"> <li><a href="https://www.facebook.com/ardiansyah.archi7"> Facebook </td>
</p>
</br>
</tr>
</body>
</html>
<<<====================================================>>>
coding untuk SKS (format html) :
<!DOCTYPE html PUBLIC "_//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org//TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<body background="d:\tgs2_webpro_ardiansyah.a_14090058\man utd 1.jpg">
<div class="wrap">
<div class="header">
<h1>PECINTA DUNIA IT</h1>
<p>WEB PROGRAMMING 1</p>
</div>
<div class="menu">
<ul>
<li><a href="home.html"target=blank>Home</a></li>
<td><div align="center"><li><a href="biodata saya.html"target=blank>Profile</a>
<td><div align="center"><li><a href="Contact Person.html"target=blank>Contact Person</a>
<li><a href="SKS Prodi D4-Teknik Informatika.html"target=blank>SKS Prodi D4-Teknik Informatika</a></li>
</ul>
</div>
<div class="badan">
<div class="SKS Prodi D4-Teknik Informatika">
<div align="center"><h2>SKS Prodi D4-Teknik Informatika</h2>
<p>
<tr>
<td >SEMESTER I</td>
<td >:</td>
<td >
<br><br>
==>> # B.INGGRIS # KALKULUS # AGAMA # PTI # ALGORITMA DAN PEMPROGRAMAN # PERANGKAT KERAS KOMPUTER # APLIKASI PERKANTORAN # ELEKTRONIKA ANOLOG
</br></br>
</td>
</p>
</tr>
<tr>
<td >SEMESTER II </td>
<td >:</td>
<td ><br><br> ==>># B.INGGRIS II # KEWARGANEGARAAN # ALJABAR LINEAR DAN MATRIK # STRUKTUR DATA # ALGORITMA DAN PEMPROGRAMAN II # ANALISA DAN PERANCANGAN SISTEM # SISTEM DIGITAL # SISTEM OPERASI</td>
</br></br>
</tr>
<tr>
<td > iii. SEMESTER III </td>
<td >:</td>
<td ><br><br> ==>> # BAHASA INGGRIS # KALKULUS # AGAMA # PTI # ALGORITMA DAN PEMROGRAMAN # PERANGKAT KERAS KOMPUTER # APLIKASI PERKANTORAN # ELEKTRONIKA ANALOG
</br></br>
</td>
</tr>
<tr>
<td > iii. SEMESTER IV </td>
<td >:</td>
<td ><br><br> ==>> # INTERAKSI MANUSIA DAN KOMPUTER II # JARINGAN KOMPUTER II # KOMPUTASI NUMERIK # OBJECT ORIENTED PROGRAMMING I # PEMPROGRAMAN CLIENT SERVER II # PEMPROGRAMAN KOMPUTER II # SISTEM BASIS DATA II # WEB PROGRAMMING I
</br></br>
</td>
</div>
</div>
</body>
</html>
<<<=====================================================>>>
coding untuk kembali ke home (format html)
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "_//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org//TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<body background="d:\tgs2_webpro_ardiansyah.a_14090058\man utd 1.jpg">
<div class="wrap">
<div class="header">
<h1>PECINTA DUNIA IT</h1>
<p>WEB PROGRAMMING 1</p>
</div>
<div class="menu">
<ul>
<li><a href="home.html"target=blank>Home</a></li>
<td><div align="center"><li><a href="biodata saya.html"target=blank>Profile</a>
<td><div align="center"><li><a href="Contact Person.html"target=blank>Contact Person</a>
<li><a href="SKS Prodi D4-Teknik Informatika.html"target=blank>SKS Prodi D4-Teknik Informatika</a></li>
</ul>
</div>
<div class="badan">
<div class="SELAMAT DATANG DI PECINTA DUNIA IT">
SELAMAT DATANG DI PECINTA DUNIA IT
<td><div align="center"><img src="d:\tgs2_webpro_ardiansyah.a_14090058\IT2.jpg" alt="Ardiansyah Agustinanda" width="875" height="420"></div></td>
</div>
</div>
</body>
</html>
<<<========================================================>>>
nah, selesai sudah... tinggal di drag saja filenya ke browser yang biasa anda gunakan...
bila kurang jelas komen aja ya gan ...
Author
Hi, Its me Hafeez. A webdesigner, blogspot developer and UI/UX Designer. I am a certified Themeforest top Author and Front-End Developer. I'am business speaker, marketer, Blogger and Javascript Programmer.
Cara Buat Website Offline ~ Ardiansyah A >>>>> Download Now
BalasHapus>>>>> Download Full
Cara Buat Website Offline ~ Ardiansyah A >>>>> Download LINK
>>>>> Download Now
Cara Buat Website Offline ~ Ardiansyah A >>>>> Download Full
>>>>> Download LINK