Your Ad Here

Ardaşık Stil Sayfaları (CSS)

26 Ekim 2007

Kenarlar (margin)

Genel

Kenar özelliği, öğelerin çevresindeki boşluğu tanımlar. İçeriği üst üste bindirmek için eksi değerler tanımlama olanağı vardır. Üst, sağ, alt ve sol kenar boşlukları ayrı özelliklerle tanımlanarak birbirlerinden bağımsız değiştirilebilir. Kısaltılmış bir kenar boşluğu özelliği hepsini topluca tanımlamakta da kullanılabilir.

Not: Netscape ve IE "body" tanımına varsayılan değer olarak 8px kenar boşluğu atar. Opera bu atamayı yapmaz, ama Opera da varsayılan değer olarak 8px dolgu kullanır. Buna göre tüm sayfa için kenar boşluğu tanımlamak isterseniz ve operada da düzgün olması için dolgu (padding) tanımı da yapmanız gerekecektir.
Destekleyen Tarayıcılar:IE: Internet Explorer, F: Firefox, N: Netscape.
W3C: Buradaki sayısal değer CSS türünü (CSS1 ya da CSS2) gösterir.
Özellik Açıklama Değerler IE F N W3C
margin Kenar tanımlarının tümünün bir arada yapıldığı kısaltılmış özelliktir. üst-kenar-boşluğu
sağ-kenar-boşluğu
alt-kenar-boşluğu
sol-kenar-boşluğu		 4 1 4 1

margin-bottom

 Bir öğe için alt kenar boşluğunu tanımlar auto
uzunluk
%		 4 1 4 1

margin-left

Sol kenar boşluğunu belirtir auto
uzunluk
%		 3 1 4 1

margin-right

Sağ kenar boşluğunu belirtir auto
uzunluk
%		 3 1 4 1
margin-top Üst kenar boşluğunu tanımlar auto
uzunluk
%		 3 1 4 1

Kenar (margin) Özelliği

Bir tanımlamada dört kenar boşluğunun tüm özelliklerini belirtmeye yarayan bir kısaltmadır.
h1 {margin: 10px}
tüm dört kenar boşluğu 10px

h1 {margin: 10px 2%}
üst ve alt kenar 10px,
sağ ve sol kenar toplam enin yüzde 2'sidir

h1 {margin: 10px 2% -10px}
üst ve alt kenar 10px,
sağ ve sol kenar toplam enin yüzde 2'si,
alt kenar ise -10px

h1 {margin: 10px 2% -10px auto}
üst kenar 10px,
sağ kenar toplam enin yüzde 2'si,
alt kenar -10px ve
sol kenar tarayıcıya bağımlıdır
Olası değerler:
üst-kenar-boşluğu sağ-kenar-boşluğu alt-kenar-boşluğu sol-kenar-boşluğu: kenar boşluğu için özellikleri belirtir. Değerler % biçiminde (kenar boşluüunun belgenin toplam boyu ya da enine yüzde oranını belirtmek için), uzunluk (değişmez kenar boşluğu belirtmek için) ve auto (tarayıcının atayacağı bir değer için) olabilir.

Varsayılan değer yoktur.

Alt Kenar (margin-bottom) Özelliği

Alt kenar boşluğu bir öğenin alt kenar boşluğu değerini belirtir.
Not: Eksi değerlere izin verilir. 
h1
{ 
margin-bottom: 10px
}

h2
{ 
margin-bottom: -20px
}
Olası değerler:
auto: Alt kenar boşluğunu tarayıcı belirler.
uzunluk: değişmez alt kenar boşluğu tanımlar. Varsayılan değer 0 dır.
%: alt kenar boşluğunu tüm belgenin boyunun yüzde oranı olarak atanmasını sağlar.

Sol Kenar (margin-left) Özelliği

Bir öğenin sol kenar boşluğunu belirtir

Not: Eksi değerlere izin verilir
 
h1
{ 
margin-left: 10px
}

h2
{ 
margin-left: -20px
}
Olası değerler:
auto: Tarayıcı değeri belirler
uzunluk: Değişmez sol kenar boşluğu tanımlar
%: Belgenin toplam eninin yüzde oranı kadar sol boşluk bırakmaya yarar

Sağ Kenar (margin-right) Özelliği

Bir öğenin Sağ kenar boşluğunu tanımlar.

Not: Eksi değerlere izin verilir.
 
h1
{ 
margin-right: 10px
}

h2
{ 
margin-right: -20px
}
Olası değerler:
auto: Tarayıcı değeri belirler
uzunluk: Değişmez sağ kenar boşluğu tanımlar
%: Belgenin toplam eninin yüzde oranı kadar sağ boşluk bırakmaya yarar

Üst Kenar (margin-top) Özelliği

Bir öğenin Üst kenar boşluğunu tanımlar.

Not: Eksi değerlere izin verilir.
 
h1
{ 
margin-top: 10px
}

h2
{ 
margin-top: -20px
}
Olası değerler:
auto: Tarayıcı değeri belirler
uzunluk: Değişmez üst kenar boşluğu tanımlar
%: Belgenin toplam boyunun yüzde oranı kadar üst boşluk bırakmaya yarar