3.5 Position Özelliği
Html’de kullandığımız Layer (katman) etiketlerinin html üzerindeki yerleştirme işlemi için kullanılır. Hemen bir örnek ile görelim.
<html>
<head>
<title>Css</title>
<style type="text/css">
<!--
div {
position:absolute;
top:20px;
left:10px;
width:200px;
height:200px;
clip:auto;
overflow:scroll;
z-index:auto;
visibility:visible;
}
-->
</style> <body>
<div>
Web Teknikleri<br>
Html<br>
Javascript<br>
Css<br>
Grafik<br>
</div>
<p> Web Teknikleri
</body>
</html>
position :
absolute : Katmanın yerinin kesin olarak belirlenmek istendiğinde kullanılır.
relative : Katmanın yerinin göreli(diğer öğelere göre değişebilen) olarak belirlenmek istendiğinde kullanılır.
static : Katmanın yerinin sabit olarak belirlenmek istendiğinde kullanılır.
top : Katmanın üst kısımdan kaç piksel aşağıda olması gerektiğini belirler.
left : Katmanın sol kısımdan kaç piksel aşağıda olması gerektiğini belirler.
width : Katmanın genişliğinin kaç piksel olacağını belirler.
height : Katmanın boyunun kaç piksel olacağını belirler.
clip : Katmanın görünmesi istenen bölgeyi içeren kutucuk.
overflow : Katmanın belirtilen yükseklik ve genişliğe sığmayan kısmına ne olacağını belirler.
auto : Otomatik olarak belirlenir.
scroll : Kaydırma çubukları ekler.
visibility : Katmanın görünebilirlik ayarı yapar
visible : Görünür hale getirir.
hidden : Gizler.
z-index : Katmanın sayfa üzerindeki sıra sayısı.
Css’te seçiciler en çok kullanılan öğelerdendir. Örneğin
<h1> etiketine Css yardımıyla belli bir şablon yüklediniz. Ama sayfanızda kullanacağınız
<h1> etiketlerinin tümünün aynı şekilde olmasını istemiyorsunuz. Bu durumda bize seçiciler yardımcı olur.
İki çeşit seçici göreceğiz. Bunlar :
Id Selector (Id seçicisi)
Class Selector (Sınıf Seçicisi)