Normalde bir header kodluyordum, ama sonradan bu bir footer olarak daha hoş durur düşüncesine kapıldım. Umarım beğenirsiniz, kodu editleyerek kendi sitenizin adreslerini yazın..
CSS kodu,
HTML kodu,
Resim,
CSS kodu,
Kod:
/* Sıfırlamalar */
body {background-image:url(http://o1310.hizliresim.com/1g/2/t6rl2.png) }
a,li { text-decoration: none; list-style: none; }
input:focus { outline: none;}
/* Footer */
#Footer { background-image: url(http://o1310.hizliresim.com/1g/2/t6s78.png); width: 974; height: 88px; }
/* Bir Not */
#birnot {position:absolute; bottom:505px; left:980px;}
/* Bir Not Yazı */
#birnotyazi a { font: 11px Arial; display: block; color:#fff; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.75); }
#birnotyazi a { position:absolute; bottom:510px; left:955px; }
/* Bir Not Yazı İçeriği */
#birnotyaziicerik a { font: 10px Arial; display: block; color:#fff; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.75); }
#birnotyaziicerik a { position:absolute; bottom:510px; left:1000px; }
/* Header Menü */
#menu {float: right; padding: 30px;}
#menu li {float: left; padding-top:3px; text-align:center; /*padding: 0px 20px 0px 20px;*/ width:76px; height:28px; }
#menu a {font: 14px Arial; color: #fff; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.75); }
#menu li:hover{float: left; padding-top:3px; text-align:center; /*padding: 0px 20px 0px 20px;*/ width:75px; height:21px; background-image:url(http://n1310.hizliresim.com/1g/2/t6srq.png) }
#menu { position:absolute; bottom:465px; left:370px; }HTML kodu,
Kod:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<!--Header -->
<div id="Footer">
<!--Bir Not -->
<div id="birnot"><img src="http://n1310.hizliresim.com/1g/2/t6s69.png" /> </div>
<div id="birnotyazi"><a href="#">Bir Not</div>
<div id="birnotyaziicerik"><a href="#"><div id="birnotyazi"><a href="#">Bu site, Furkomm adına kodlanmıştır.</div></div>
<!--Logo -->
<div id="logo"><img src="http://j1310.hizliresim.com/1g/2/t6tq2.png" /></div>
<!-- Menü -->
<div id="menu">
<li><a href="/index.php">İndex</a></li>
<li><a href="/memberlist.php">Üyeler</a></li>
<li><a href="/portal.php">Portal</a></li>
<li><a href="/calendar.php">Takvim</a></li>
</div>
<!--#Header -->
</body>
</html>Resim,
