HTML Bölümüne Yazılacak Kod:


Kod:
<!doctype html>
Kod:
<html> <head> <**** charset="utf-8"> <title>Başlıksız Belge</title> <link rel="stylesheet" href="stil.css"/> </head> <body> <div class="sablon"> <div class="logo"></div> <div class="logo2">BURAYA SİTENİN BANNERI GELECEK</div> <div class="menu"> <ul> <li><a>Anasayfa</a></li> <li><a>Hakkımızda</a></li> <li><a>Çalışmalarımız</a></li> <li><a>İletişim</a></li> </ul> </div> <div class="sosyal"> <a href="../Uygulamam16.html"><img src="images/instagram.png" width="41" height="46"></a> <a><img src="images/facebook.png" width="41" height="46"></a> <a><img src="images/twitter.png" width="41" height="46"></a> </div> <div class="kutu"></div> <div class="kutu1"></div> <div class="kutu2"></div> <div class="kutu3"></div> <div class="alt"></div> </div> </body>
</html>


CSS Bölümüne Yazılacak Kod:


Kod:
Kod:
.sablon{width:560px; height:auto; margin:50px auto;}
Kod:

Kod:
.logo{width:100px; height:100px; float:left; background:url(images/logo.jpg)} .logo2{width:440px; height:60px; float:left; margin:0 0 0 10px; background:#003466; border-radius:10px; text-align:center; padding:40px 0 0 0; color:#FFF} .menu{width:400px; height:50px; float:left; margin:10px 0 0 0; background:#00468c; } .sosyal{width:135px; height:50px; float:left; margin:10px 0 0 10px;} .kutu{width:560px; height:250px; float:left; margin:10px 0 0 0; background:#016dd9;} .kutu1{width:180px; height:125px; float:left; margin:10px 0 0 0; background:#4da6ff} .kutu2{width:180px; height:125px; float:left; margin:10px 0 0 10px; background:#99cdff;} .kutu3{width:180px; height:125px; float:left; margin:10px 0 0 10px; background:#bedffe;} .alt{width:560px; height:80px; float:left; margin:10px 0 0 0; background:#bfeefe; border-radius:10px;} .menu ul{margin:0; padding:0; list-style:none;} .menu ul li{float:left;} .menu ul li a {display:block; width:100px; height:35px; text-decoration:none; text-align:center; font:13px tahoma; color:#fff; margin:px 0 0 0; padding:15px 0 0 0}
.menu ul li a:hover{text-decoration:underline; background:#06f;}