HTML 5 ve CSS ile Sabit Footer ve Header

Evet arkadaşlar bu dersimizde facebook’unda kullandığı sabit header kısmını öğreneceğiz.

Biz bu dersimizde ek olarak footer da yapacağız mantık olarak aynı kodları kullanacağız büyük çoğunlukla.

 

Örnek videomuzu inceleyip daha fazla bilgi alabilirsiniz.

 

Örnek kodlarımız:

<html>
<head>
<style type=”text/css”>
body{
background-color:#ccc;
margin:48px 0px 0px 64px;
}
div#ust{
position:fixed;
top:0px;
left:0px;
width:100%;
color:#ccc;
background:#333;
padding:8px;
}
div#alt{
position:fixed;
bottom:0px;
left:0px;
width:100%;
color:#ccc;
background:#333;
padding:8px;
}
</style>
</head>
<body>
<div id=”ust”>Ust div</div>
<h2>Merhaba</h2>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<p>Bu bir deneme videosudur.</p>
<div id=”alt”>Alt div</div>
</body>
</html>

 

Comments
  1. 5 sene ago
  2. 5 sene ago
  3. 5 sene ago
  4. 5 sene ago
  5. 5 sene ago
  6. 5 sene ago
  7. 3 sene ago

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir