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;}