<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="hampa.css">
</head>
<body>
</body>
</html>
Langkah ke-2 : kita akan membuat header Ketikkan kodenya di dalam body
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="hampa.css">
</head>
<body>
<header>
<p> <a href="">MRP </a></p>
<div id= gambar>
<a href="" title="Facebook"><img src="facebook.png"></a><br>
<a href="" title="Twitter"><img src="twitter.png"></a><br>
<a href="" title="Rss"><img src="rss.png"></a><br>
</div>
</header>
</body>
</html>
nahh di situ <header> </header> termasuk dalam HTML 5 ,, okee lalu kita ketik CSS nya
header{
background-color: #0000A0;
width: 100%;
height: 100px;
}
p a{
color: #0B39F4;
font-size: 90px;
text-decoration: none;
}
p a:hover{
color: #000080;
text-decoration: none;
}
body{
margin: 0;
padding: 0;
}
langkah ke- 3: kita akan membuat content dan sidebar ;
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="hampa.css">
</head>
<body>
<header>
<p> <a href="">MRP </a></p>
<div id= gambar>
<a href="" title="Facebook"><img src="facebook.png"></a><br>
<a href="" title="Twitter"><img src="twitter.png"></a><br>
<a href="" title="Rss"><img src="rss.png"></a><br>
</div>
</header>
<div class="container">
<section class="sidebar">
</section>
</div>
nah di situ <div class="container"> </div> termasuk dalam HTML 5 dan juga <section class="sidebar">
oke sekarang kita masukkan CSS nya ;
.container{
width: 90%;
height: 80%;
background-color: #8080C0;
margin: 0 auto;
}
.sidebar{
background-color: #000;
margin: 0 auto;
width: 20%;
height: 100%;
float: left;
}
langkah 4 : kita akan membuat Footer
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="hampa.css">
</head>
<body>
<header>
<p> <a href="">MRP </a></p>
<div id= gambar>
<a href="" title="Facebook"><img src="facebook.png"></a><br>
<a href="" title="Twitter"><img src="twitter.png"></a><br>
<a href="" title="Rss"><img src="rss.png"></a><br>
</div>
</header>
<div class="container">
<section class="sidebar">
</section>
</div>
<footer>
<footer>
</body>
</html>
nah disitu <footer> <footer> termasuk dalam HTML 5 oke dan sekarang kita masukkan css nya
footer{
margin: 0 auto;
background-color: #0000A0;
width: 100%;
height: 30%;
}
nah maka akan menjadi seperti ini ;
Written by Nulled
Blogger Muda Yang Masih Berstatus Pelajar, Yang Berkecimpung Di Dunia IT Semenjak Tahun 2013 Dan Ingin Berbagi Ilmu Pengetahuan Tentang Programming Web Design,Desktop Application, Tips Blogging, Google Adsense, Dan Internet Marketing. Temukan Celotehan Saya Di Twitter @Anaksmkti
0 comments:
Post a Comment