Web dibawah ini adalah web sederhana yang saya buat…
tampilan menu dari web saya
Lalu disini membuat beberapa subMenu seperti gambar gambar diatas,,,
Disini saya akan membrikan rincian kode yang saya buat pada setiap sub menu.
MENU HOME<body class="twoColElsLtHdr" bgcolor="#FFCC99">
<div id="container">
<div id="header">
<table width="45%" border="1">
<tr>
<td width="33%" height="33" align="center" bgcolor="#6699CC"><a href="layanan.html">KOMENTAR</a></td>
<td width="34%" align="center" bgcolor="#CCCCCC"><a href="iklan.html">IKLAN</a></td>
<td width="33%" align="center" bgcolor="#333333"><a href="kontak.html">KONTAK</a></td>
</tr>
</table>
<table width="100%" border="1" background="../image/background.png">
<tr>
<td height="150" > <center><marquee behavior="alternate" ><h1>Selamat <span class="style2 style1">Datang</span> di Website Saya</h1>
</marquee></center>
<center><h2 class="style2 style1">Terima Kasih Telah Berkunjung </h2>
</center></td>
</tr>
<tr>
<td height="43"><table width="100%" border="1">
<tr>
<td width="24%" height="31" align="center" bgcolor="#00CCFF"><a href="home1.html">HOME</a></td>
<td width="24%" align="center" bgcolor="#00CCFF"><a href="profil.html">PROFIL</a></td>
<td width="24%"align="center" bgcolor="#00Ccff"><a href="berita.html">BERITA</a></td>
<td width="24%" align="center" bgcolor="#ooccFF"><a href="sumber.html">SUMBER</a></td>
</tr>
</table></td>
</tr>
</table>
<!-- end #header --></div>
<div id="sidebar1">
<h3>SEJARAH NOVEL </h3>
<p align="left" >Perkataan “novel” banyak maksud dan dapat dibahagikan kepada dua iaitu “novel kecil” yang dikenali sebagi novella dan “novel besar” yang dipanggil novel. Semua cerita yang panjangnya sederhana atau yang sangat panjang semuanya boleh terangkum dalam satu dan dikenali sebagi novel. Kemuncunlan karya-karya sastera seperti novel-novel Melayu sejak tahun-tahun 1920an hingga akhir-akhir tahun 1960an dengan membawakan isu, pemikiran dan dan juga gaya bahasa dan teknik penceritaan tersendiri dan sesuai pada kontek zamannya, sebenarnya telah menjadi dasar (model) dan kovensi kepada proses penciptaan bentuk novel yang kukuh kepada pengarang-pengarang novel Melayu yang mula brkarya pada dekad 40an hingga dekad 60an.</p>
<!-- end #sidebar1 --></div>
<div id="mainContent">
<p>Website ini merupakan homepage pertama saya.. </p>
<p>Website ini Dibuat sebagai wadah saya untuk menulis dan mengarang. </p>
<p>Bila ada Kritik dan Saran,klik <strong>KOMENTER </strong>dan tinggalkan komentar Anda </p>
<p>atau Anda bisa juga klik <strong>KONTAK. </strong></p>
<h1> </h1>
<!-- end #mainContent --></div>
<!-- This clearing element should immediately follow the #mainContent div in order to force the #container div to contain all child floats --><br class="clearfloat" />
<div id="footer">
<!-- end #footer --></div>
<!-- end #container --></div>
</body>
</html>
Hasil tampilannya akan seperti dibawah ini
Menu profil<body class="twoColElsLtHdr">
<div id="container">
<div id="header">
<table width="45%" border="1">
<tr>
<td width="33%" height="33" align="center" bgcolor="#6699CC"><a href="layanan.html">KOMENTAR</a></td>
<td width="34%" align="center" bgcolor="#CCCCCC"><a href="iklan.html">IKLAN</a></td>
<td width="33%" align="center" bgcolor="#333333"><a href="kontak.html">KONTAK</a></td>
</tr>
</table>
<table width="100%" border="1" background="../image/background.png">
<tr>
<td height="150"> <center><marquee behavior="alternate" ><h1>Selamat <span class="style2">Datang</span> di Website Saya</h1>
</marquee></center>
<center><h3 class="style2">Terima Kasih Telah Berkunjung </h3>
</center></td>
</tr>
<tr>
<td><table width="100%" border="1">
<tr>
<td width="24%" height="31" align="center" bgcolor="#00CCFF"><a href="home1.html">HOME</a></td>
<td width="24%" align="center" bgcolor="#00CCFF"><a href="profil.html">PROFIL</a></td>
<td width="24%"align="center" bgcolor="#00Ccff"><a href="berita.html">BERITA</a></td>
<td width="24%" align="center" bgcolor="#ooccFF"><a href="sumber.html">SUMBER</a></td>
</tr>
</table></td>
</tr>
</table>
<!-- end #header --></div>
<div id="sidebar1">
<strong>PROFIL PENULIS</strong>
</p>
<p><a href="biografi.html">Ahmad Fuadi</a> <br />
<img src="../image/fuadi.jpg" width="116" height="177" /></p>
<a href="biografi2.html">Asma Nadia</a><br />
<img src="../image/Asma Nadia.JPG" width="160" height="198" /><a href="biografi3.html">Habiburrahman El Shirazy</a><br />
<img src="../image/Habiburrahman.jpg" width="179" height="231" />
<p><br />
</p>
<!-- end #sidebar1 --></div>
<div id="mainContent">
<h4 class="style1" align="justify">PROFIL SAYA </h4>
<img src="../image/barbie.jpg" width="123" height="234" />
<p>NAMA : FATMA RAHMAN</p>
<p>NAMA Panggilan : FATMA</p>
<p>Kelahiran : Gorontalo,31 Oktober 1996</p>
<p>Alamat : Desa Huyula, jl.Anggrek Kwandang </p>
<p>Seorang Mahasiswa di salah satu kampus di Gorontalo, yakni tepatnya di KAMPUS POLITEKNIK GORONTALO mengambil jurusan Teknik Informatika.<br />
bercita-cita jadi seorang penulis dan motivator, menjadi seorang penulis berawal dari kebiasaan membaca cerpen,novel,cerita rakyat menonton film Drama, <br />
dan menjadi seorang motivator pada awalnya karena terbiasa mengarang kata-kata dan menonton siaran televisi metrotv Mario Teguh GoldenWays.</p>
<!-- end #mainContent --></div>
<!-- This clearing element should immediately follow the #mainContent div in order to force the #container div to contain all child floats --><br class="clearfloat" />
Untuk profil Penulis terdapat link masing-masing tepai disini saya hanya menggunakan link utama profil
MENU BERITA<body class="oneColElsCtrHdr">
<div id="container">
<div id="header">
<table width="45%" border="1">
<tr>
<td width="33%" height="33" align="center" bgcolor="#6699CC"><a href="layanan.html">KOMENTAR</a></td>
<td width="34%" align="center" bgcolor="#CCCCCC"><a href="iklan.html">IKLAN</a></td>
<td width="33%" align="center" bgcolor="#333333"><a href="kontak.html">KONTAK</a></td>
</tr>
</table>
<table width="100%" border="1" background="../image/background.png">
<tr>
<td height="150" > <center><marquee behavior="alternate" ><h1>Selamat <span class="style2 style1">Datang</span> di Website Saya</h1>
</marquee></center>
<center><h2 class="style2 style1">Terima Kasih Telah Berkunjung </h2>
</center></td>
</tr>
<tr>
<td height="43"><table width="100%" border="1">
<tr>
<td width="24%" height="31" align="center" bgcolor="#00CCFF"><a href="home1.html">HOME</a></td>
<td width="24%" align="center" bgcolor="#00CCFF"><a href="profil.html">PROFIL</a></td>
<td width="24%"align="center" bgcolor="#00Ccff"><a href="berita.html">BERITA</a></td>
<td width="24%" align="center" bgcolor="#ooccFF"><a href="sumber.html">SUMBER</a></td>
</tr>
</table></td>
</tr>
</table>
<!-- end #header --></div>
<div id="mainContent">
<h1> BERITA TEKNOLOGI</h1>
<p> </p>
<p><B>Data dan Fakta tentang Teknologi Bluetooth </B> </p>
<p>Bluetooth menjadi teknologi yang sangat awam pada saat ini. Dengan adanya Bluetooth, menghubungkan antara satu perangkat elektronik dengan perangkat lainnya pun menjadi lebih sederhana. Seiring dengan perkembangan, berbagai perangkat pun banyak dilengkapi dengan Bluetooth. Dari handphone, komputer ataupun headset.</p>
<p><IMG src="../image/teknologi-bluetooth.jpg" width="436" height="247" />
<!-- end #mainContent -->
</p>
<p>Meskipun sering menggunakan Bluetooth, apakah Anda tahu asal mula penamaan Bluetooth? Selain itu, terdapat fakta-fakta lain tentang Bluetooth yang jarang diketahui oleh orang awam. Berikut ini adalah fakta-fakta tersebut.</p>
<p>1. Penamaan Bluetooth diambil dari salah seorang raja Denmark yang bernama King Harald Blatand. Dalam pelafalan Inggris, nama tersebut dibaca King Harold Bluetooth. Raja ini berkuasa dalam kurun 958 hingga 986. King Harrald pun terkenal sebagai orang yang mampu menyatukan kawasan Denmark, Norwegia dan Swedia.</p>
<p>2. Teknologi Bluetooth pertama diterapkan oleh Ericsson pada tahun 1994. Perusahaan yang berbasis di Swedia tersebut mengadakan penelitian untuk mengetahui keuntungan menggunakan teknologi Bluetooth. Selanjutnya, bersama Intel, IBM, Toshiba serta Nokia, Ericsson menghimpun Special Interest Group (SIG) pada tahun 1998 dan selanjutnya mengeluarkan spesifikasi Bluetooth pertama kali di dunia pada tahun 1999.</p>
<p>3. Bluetooth merupakan salah satu sinyal radio. Sebagai sinyal radio, ternyata Bluetooth tidak cocok digunakan untuk sarana berkomunikasi. Hal ini terungkap setelah Andretti Racing Team menggunakannya. Dan, karena mengandung gelombang radio microwave, penggunaan Bluetooth dikatakan dapat menimbulkan permasalahan kesehatan.</p>
<p>4. Bluetooth memiliki range yang cukup luas. Sebuah perangkat Bluetooth, tetap mampu bekerja dalam jarak 10 meter. Bahkan dalam perkembangan terbaru, Bluetooth mampu bekerja dalam jarak 100 meter.</p>
<p>5. Saat ini, 95 persen handphone yang terjual memiliki konektivitas Bluetooth. Jumlah tersebut jauh meningkat dibandingkan tahun 2008 di mana hanya terdapat 5 persen yang ada di pasaran.</p>
<p> </p>
</div>
<div id="footer">
<!-- end #footer -->
</div>
<!-- end #container --></div>
</body>
</html>
MENU SUMBER<body class="oneColElsCtrHdr">
<div id="container">
<div id="header">
<table width="45%" border="1">
<tr>
<td width="33%" height="33" align="center" bgcolor="#6699CC"><a href="layanan.html">KOMENTAR</a></td>
<td width="34%" align="center" bgcolor="#CCCCCC"><a href="iklan.html">IKLAN</a></td>
<td width="33%" align="center" bgcolor="#333333"><a href="kontak.html">KONTAK</a></td>
</tr>
</table>
<table width="100%" border="1" background="../image/background.png">
<tr>
<td height="150" > <center><marquee behavior="alternate" ><h1>Selamat <span class="style2 style1">Datang</span> di Website Saya</h1>
</marquee></center>
<center><h2 class="style2 style1">Terima Kasih Telah Berkunjung </h2>
</center></td>
</tr>
<tr>
<td height="43"><table width="100%" border="1">
<tr>
<td width="24%" height="31" align="center" bgcolor="#00CCFF"><a href="home1.html">HOME</a></td>
<td width="24%" align="center" bgcolor="#00CCFF"><a href="profil.html">PROFIL</a></td>
<td width="24%"align="center" bgcolor="#00Ccff"><a href="berita.html">BERITA</a></td>
<td width="24%" align="center" bgcolor="#ooccFF"><a href="sumber.html">SUMBER</a></td>
</tr>
</table></td>
</tr>
</table>
<!-- end #header --></div>
<div id="mainContent">
<h1>SUMBER</h1>
<p> </p>
<p><a href="http://www.si-pedia.com/2014/03/profil-7-penulis-best-seller-terkenal-indonesia.html">http://www.si-pedia.com/2014/03/profil-7-penulis-best-seller-terkenal-indonesia.html</a></p>
<p>http://negeri5menara.com/penulis/</p>
<p><a href="http://tajaulama90.blogspot.com/2011/01/sejarah-perkembangan-novel-1960.html">http://tajaulama90.blogspot.com/2011/01/sejarah-perkembangan-novel-1960.html</a></p>
<p>http://gopego.com/news/tags/android</p>
<p>http://gopego.com/news/a/2015/05/samsung-galaxy-note-5-gunakan-display-4k-konsep</p>
<p>http://gopego.com/news/a/2015/05/lenovo-a6600-bakal-rilis-dengan-desain-stylish-harga-sejutaan</p>
<p>http://www.beritateknologi.com/tentang/perkembangan-teknologi/</p>
<p>http://www.beritateknologi.com/data-dan-fakta-tentang-teknologi-bluetooth/</p>
<!-- end #mainContent --></div>
<div id="footer">
<!-- end #footer --></div>
<!-- end #container --></div>
</body>
</html>
Dan untuk menu 3 yang paling pojok atas silahkan dilanjutkan sendiri…