Jumat, 20 Mei 2011

Simple web design with HTML/CSS

Bagi teman-teman yang baru menekuni bidang web design
berikut ini sedikit tutorial lama dari saya tentang bagaimana membuat sebuah web pages dengan menggunakan HTML dan CSS sederhana
script ini saya posting berhubung karena kemarin malam ada yang PM ke saya untuk kirim tutor kyk gni...
berhubung tutorial ini saya tujukan kepada para newbie maka para master tolong jangan di ketawain yah.. xixixixi :D
slamat menyimak aja

<html>
<head>
<title>.:: WEB Design ::.</title>
<style type="text/css">
#main{
width:700px;
margin:0 auto;
border:1px solid #808080;
padding:2px;
}
#menu-kiri{
width:130px;
float:left;
border:1px solid #808080;
margin-right:2px;
}
#menu-kanan{
width:130px;
float:left;
border:1px solid #808080;
margin-left:2px;
}
#isi-tengah{
width:430px;
float:left;
border:1px solid #808080;
background-color:#66FFCC;
}
#footer{
padding:1px;
margin:1px;
border:1px solid #808080;
text-align:center;
}
#header{
padding:1px;
margin:1px;
border:1px solid #808080;
text-align:center;
height:100px;
background-color:#FF0000;
}
.clear{
float:none;
clear:both;
}
body{
font-family:tahoma;
font-size:12px;
}
#menu-kiri div, #menu-kanan div{
padding:2px;
margin:2px;
border:1px solid #004000;
background-color:#66FFCC;
}</style>

</head>
<body>
<div id="main">
<div id="header">web Header</div>
<div id="menu-kiri">
<div>Menu1</div>
<div>Menu2</div>
<div>Menu3</div>
<div>Menu4</div>
<div>Menu5</div>
</div>
<div id="isi-tengah">website content<br />

website content<br />
website content<br />
website content<br />
website content<br />
website content<br />
</div>

<div id="menu-kanan">
<div>Menu1</div>
<div>Menu2</div>
<div>Menu3</div>
<div>Menu4</div>
<div>Menu5</div>
</div>
<div class="clear"></div>
<div id="footer">footer</div>
</div>
</body>
</html>

Tidak ada komentar:

Posting Komentar

Artikel Populer