e-dersler   Positioning with CSS

Sayfaya Başlık ve Altlık Koyma

Sayfamızın tasarımının tamamlanması için başlık (header) ve altlık (footer) bölümlerinin de hazırlanması gerekir. Tabii, bunlar her sayfa için gerekli görülmeyebilir.


Başlık ve altlık için CSS kodları:

.Header {
    margin-top: 10px;
    margin-left: 160px;
    } 
		
.Footer {
  background: #FFFFFF;
  color : #000099;
  font-family : Arial, Tahoma, Verdana, Helvetica, sans-serif;
  font-size: 12px;
  padding : 2px;
  margin: 2px;
  border-color : #48D1CC;
  border-style : groove;
  border-width : 2px;
  }

Bu kodları head bölümündeki style içine yazıyoruz. Sayfamızın iskeleti şöyle olacaktır: :

<body>

<div class="Header">Resimli Başlık  konuluyor
<img src="images/tutorial.jpg" width="277" height="38" alt="CSS Issues">
</div>

<div class="Navigation"> NAVIGATION Kutusu
   Burada linkler yer alacak
</div>

<div class="govde">Gövdeyi açar
   Gövdeye girecek elemanlar
<br />

<div class="Footer">Gövde içinde Footer kutusunu açar
   Sayfa Altlığına yazılacaklar
</div>Footer kutusunu kapatır

</div>Gövdeyi kapatır
</body>

Artık sayfaya girecek metni koyabiliriz. Bundan sonraki adım o işi yapacaktır.


|||||||||| Sekizinci Adım (Sayfaya Metin Yerleştirme) >>