Hallo kk :D
ketemu lagi nih sama saya di Artikel Anip :D
kali ini saya akan memberikan tutorial "Cara Membuat Software Sederhana Menggunakan NotePad".
Selain membuat software dan game , NotePad juga bisa di gunakan untuk membuat website sederhana loh!!
mau taukan gimana caranya
Langsung aja yuk.
- Buka NotePad (pastinya :p)
- Copy kode di bawah ini dan Pastekan di NotePad
<div style="text-align: center;">
<head>
<!-- Website by: Artikel Anip-->
<title>Artikel Anip</title>
<meta name="author" content="Hanif Fathullah" />
<meta name="keywords" content="Contoh" />
<meta name="description" content="Contoh Website" />
<link rel="SHORTCUT ICON" href="#">
<style type="text/css">
body {background-image: url(http://i57.servimg.com/u/f57/18/18/00/82/a10.png);
background-color: black;color: #ffffff;font-weight: bold;text-align: center;}
img{opacity:0.75; filter:alpha(opacity=75);}
.redx {text-shadow: 0 0 6px blue, 0 0 5px blue, 0 0 5px blue;color: #FFF}
.lol {color: #3b1ae1;text-shadow: 0 0 3px white, 0 0 3px White, 0 0 5px #e9e4e7, 0 0 5px #e9e4e7;}
</style>
</head>
<body oncontextmenu="return True" onkeydown="return True" onmousedown="return True">
<br /><br /><br /><br /><div style="font-family: txt;font-size: 46px;" class="redx">Artikel Anip</div>
<br>|<font size="5"><b><a href="#"> Home </b></font></a>|<font size="5"><b><a href="https://www.facebook.com/lmkprog?ref=tn_tnmn"> Profil Saya </b></font></a>|<font size="5"><b><a href="https://www.aanip.tk"> Blog Saya </b></font></a>|
<br><br><table width="200" border="0" cellpadding="0" cellspacing="0">
<tbody><tr><div style="text-align: center;">
<b>Selamat Datang Di Website Saya</b><br>Ini adalah web pertama yang saya buat,
<br>web ini merupakan sebuah gambaran dasar dalam membuat website prpfesional.
<br>Tidak ada seorangpun yang pandai ilmu sebelum belajar dasar-dasar ilmu,
<br>karena dasar-dasar ilmu merupakan pondasi paling awal untuk membangun atau mencapai ilmu yang lebih tinggi.
<br>Seorang anak lahir tidak langsung berlari, tapi dengan tahapan tertentu anak bisa berlari,
<br>berguling dahulu, merangkak dahulu, baru berlari.
</td></tr></tbody></table></div><br /><!-- Widget - http://error-99.blogspot.com - Start -->
<style>
ul#navigation {
position: fixed;
margin: 0px;
padding: 0px;
top: 0px;
right: 0px;
list-style: none;
z-index:999999;
width: 993px;
}
ul#navigation li {
width: 103px;
display:inline;
float:left;
border:0;
}
ul#navigation li a {
display: block;
float:left;
margin-top: -2px;
width: 100px;
height: 25px;
background-color:#000000;
background-repeat:no-repeat;
background-position:50% 10px;
border:1px solid #BDDCEF;
-moz-border-radius:0px 0px 10px 10px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-khtml-border-bottom-right-radius: 10px;
-khtml-border-bottom-left-radius: 10px;
text-decoration:none;
text-align:center;
padding-top:80px;
opacity: 0.96;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=40);
}
ul#navigation li a:hover{
background-color:#BDBDBD;
}
ul#navigation li a span{
letter-spacing:2px;
font-size:11px;
color:#FFFFFF;
font-family:trebuchet-ms, arial, tahoma, Sans-Serif;
font-weight:bold;
text-shadow: 0 -1px 1px #fff;
}
ul#navigation .rss a{
background-image: url(http://i57.servimg.com/u/f57/18/18/00/82/rss10.png);
}
ul#navigation .facebook a {
background-image: url(http://i57.servimg.com/u/f57/18/18/00/82/facebo10.png);
}
ul#navigation .twitter a {
background-image: url(http://i57.servimg.com/u/f57/18/18/00/82/twitte10.png);
}
ul#navigation .g-mail a{
background-image: url(http://i57.servimg.com/u/f57/18/18/00/82/google10.png);
}
ul#navigation .y-mail a{
background-image: url(http://i57.servimg.com/u/f57/18/18/00/82/yahoo-10.png);
}
ul#navigation .youtube a{
background-image: url(http://i57.servimg.com/u/f57/18/18/00/82/youtub10.png);
}
</style>
<script src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.js" type="text/javascript">
</script>
<script type="text/javascript">
$(function() {
var d=300;
$('#navigation a').each(function(){
$(this).stop().animate({
'marginTop':'-80px'
},d+=150);
});
$('#navigation > li').hover(
function () {
$('a',$(this)).stop().animate({
'marginTop':'-2px'
},200);
},
function () {
$('a',$(this)).stop().animate({
'marginTop':'-80px'
},200);
}
);
});
</script>
<ul id="navigation">
<li class="rss"><a target="_blank" href="http://aanip.blogspot.com/atom.xml" rel="=http://feeds.feedburner.com/ArtikelAnip">RSS Feed</a></li><li class="facebook"><a target="_blank"href="https://www.facebook.com/lmkprog?ref=tn_tnmn">Facebook</a></li>
<li class="twitter"><a target="_blank"href="https://twitter.com/">Twitter</a></li>
<li class="g-mail a"><a target="_blank"href="https://google.com/+HanifFathullah">Google</a>
<li class="y-mail a"><a target="_blank"href="https://www.Yahoo.com/">Yahoo</a>
<li class="youtube a"><a target="_blank" href="https://www.Youtube.com/">YouTube</a></li>
</li>
</li></ul>
<!-- Widget fb kaleng Artikel Anip - End--><br /><br />
<marquee bgcolor="black" style="font-family: Arial; font-size:20px; color:#ffffff;">Copyright © 2014 - All Rights Reserved</marquee>
</body>
</html>
Ket:
Warna Biru bisa kamu ubah sesuai kemauan mu
Warna Merah adalah background website kalian
Warna Orange adalah warna font website
Warna Hijau bisa kamu ubah dengan url facebook dan blog kamu
Block Merah adalah isi website
Block Hijau adalah URL RSS Feed, bisa kamu ubah
Block Biru adalah URL Facebook, bisa kamu ubah
Block Biru Muda adalah URL Twitter,bisa kamu ubah
Block Pink adalah URL Akun google, bisa kamu ubah
Block Orange adalah URL Yahoo, bisa kamu ubah
Block Coklat adalah URL Youtube,bisa kamu ubah
- Simpan hasil dengan format .html
- Buka website sederhana kalian .. maka hasinya akan seperti gambar dibawah ini
Sekian Artikel dari saya, jika ada yang ingin di tanyakan silahkan berkomentar ^_^
semoga bermanfaat ^_^
Postingan Kelas:
Tutorial
3 Komentar untuk "Cara Membuat Website Sederhana Menggunakan NotePad"
Wah makasih banget Hanif .... posting anda sangat membantu :*
keren gan nice post
izin coba kang
-- Baca sebelum berkomentar --
1. Dilarang mencari keributan
2. Dilarang SPAM = Hapus Komentar
3. Dilarang Memaki admin atau sesama komentator
4. Berkomentar Sesuai Artikel/Postingan
5. Berkomentarlah Dengan Sopan
6. Dilarang menyertakan link atau promosi di komentar (Hapus Komentar)
Jika anda sudah mengerti , silahkan berkomentar
-- Terimakasih atas perhatiannya --