Saya mengamsumsi anda sudah cukup mengenal keywords pada program HTML seperti <tag>, <a href>, <p> ,<br>, <frameset>,<frame> <header>, <footer> dan anda sudah cukup mengetahui tentang fungsinya tersebut sehingga memudahkan dalam mebuat program ini....
Berikut saya akan membuat contoh web sederhana yang mungkin membantu anda.
contoh webesite yang akan saya berikan modelnya seperti ini
Tetapi sebulum anda membuatnya anda sebaiknya sudah memiliki beberapa desain web sederhananya sehingga membantu agar desain ini berjalan.
Berikut adalah kodingnya beserta penjelasan singkatnya
Berikut saya akan membuat contoh web sederhana yang mungkin membantu anda.
contoh webesite yang akan saya berikan modelnya seperti ini
Tetapi sebulum anda membuatnya anda sebaiknya sudah memiliki beberapa desain web sederhananya sehingga membantu agar desain ini berjalan.
Berikut adalah kodingnya beserta penjelasan singkatnya
<!DOCTYPE HTML>
<html lang=en>
<head>
<title>Simplistic HTML5</title>
<meta charset=utf-8>
<style>
body { width:500px; margin:auto;
}
header, nav, article, footer { display:block;
}
header { width:500px; background-color:#FF9966; text-align:center; margin:auto;
}
nav { float:left; width:25%; background-color: #FF9966; margin-bottom:10px;
}
article { float:right; width:70%; background-color:#FF9966; margin-bottom:10px;
}
footer { clear:both; background-color:#FF9966; text-align:center;
}
h2 { font-size:large; font-weight:bold; margin-top:0; margin-bottom:0;
}
</style>
</head>
<body>
<header>
<h1>header goes here</h1>
</header>
<nav>
<ul>
</nav>
<article>
<h2>Article</h2>
Are you illiterate? Write today for free course.
</article>
<article>
<h2>Another Article</h2>
Stock up for Christmas. Limited to one per family.
</article>
<footer>
Footer. Perhaps for a copyright statement
</footer>
</body>
</html>
<html lang=en>
<head>
<title>Simplistic HTML5</title>
<meta charset=utf-8>
<style>
body { width:500px; margin:auto;
}
header, nav, article, footer { display:block;
}
header { width:500px; background-color:#FF9966; text-align:center; margin:auto;
}
nav { float:left; width:25%; background-color: #FF9966; margin-bottom:10px;
}
article { float:right; width:70%; background-color:#FF9966; margin-bottom:10px;
}
footer { clear:both; background-color:#FF9966; text-align:center;
}
h2 { font-size:large; font-weight:bold; margin-top:0; margin-bottom:0;
}
</style>
</head>
<body>
<header>
<h1>header goes here</h1>
</header>
<nav>
<ul>
</ul><li><a href="page-one.html" >Page One</a></li>
<li><a href="page-two.html" >Page Two</a></li>
<li><a href="index.html" >Home page</a></li>
</nav>
<article>
<h2>Article</h2>
Are you illiterate? Write today for free course.
</article>
<article>
<h2>Another Article</h2>
Stock up for Christmas. Limited to one per family.
</article>
<footer>
Footer. Perhaps for a copyright statement
</footer>
</body>
</html>
- <!DOCTIPE HTML> merupakan bahasa programan untuk HTML5 jika yang anda pelajari masih versi XHTML maka anda cukup menghapusnya dan tidak perlu menulisnya
- <html lang=en> Ini merupakan pemerograman menggunakan bahasa inggris jika anda ingin mengganti dalam bahasa lain bisa di liat di sini
- untuk yang saya coret anda bisa menggantinya dengan nama desain anda sendiri yang telah anda miliki.
Tidak ada komentar:
Posting Komentar
Terima Kasih Sudah Mau Berkunjung