Ardaşık Stil Sayfaları (CSS)

26 Ekim 2007

Dolgu (padding)

Genel

Dolgu özelliği, öğelerin çevresindeki boşluğu tanımlar. Eksi değerler tanımlanamaz. Üst, sağ, alt ve sol dolgular ayrı özelliklerle tanımlanarak birbirlerinden bağımsız değiştirilebilir. Kısaltılmış bir dolgu özelliği hepsini topluca tanımlamakta da kullanılabilir.
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
padding Bir tanımda dolgu özelliğinin tüm değerlerini atamaya yarar. üst-dolgu
sağ-dolgu
alt-dolgu
sol-dolgu		 4 1 4 1

padding-bottom

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

padding-left

Sol dolguyu belirtir auto
uzunluk
%		 3 1 4 1

padding-right

Sağ dolguyu belirtir auto
uzunluk
%		 3 1 4 1
margin-top Üst dolguyu tanımlar auto
uzunluk
%		 3 1 4 1

Kenar boşluğu (margin) Özelliği

Bir tanımlamada dört dolgunun tüm özelliklerini belirtmeye yarayan bir kısaltmadır.
 
h1 {padding: 10px}
her dört kenarda dolgu 10px

h1 {padding: 10px 2%}
üst ve alt dolgu 10px,
sol ve sağ dolgu en yakın öğenin
toplam eninin yüzde 2'sidir.

h1 {padding: 10px 2% 15px}
üst dolgu 10px, sol ve sağ dolgu
en yakın öğenin toplam eninin yüzde 2'si kadar
alt dolguysa 15px'dir

h1 {padding: 10px 2% 15px 20px}
üst dolgu 10px,
sağ dolgu, en yakın öğenin
toplam eninin yüzde 2'si
alt dolgu 15px,
sol dolgu 20px'dir
Olası değerler:
üst-dolgu sağ-dolgu alt-dolgu sol-dolgu: dolgu için özellikleri belirtir. Değerler % biçiminde (dolgunun belgenin toplam boyu ya da enine yüzde oranını belirtmek için), uzunluk (değişmez dolguyu belirtmek için) ve auto (tarayıcının atayacağı bir değer için) olabilir.

Varsayılan değer yoktur.

Alt Dolgu (padding-bottom) Özelliği

Alt dolgu, bir öğenin alt dolgu değerini belirtir. 
h1
{ 
margin-bottom: 10px
}

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

Sol Dolgu (padding-left) Özelliği

Bir öğenin sol dolgusunu belirtir
 
h1
{ 
padding-left: 10px
}
Olası değerler:
auto: Tarayıcı değeri belirler
uzunluk: Değişmez sol dolguyu tanımlar
%: Belgenin toplam eninin yüzde oranı kadar sol dolgu bırakmaya yarar

Sağ Dolgu (padding-right) Özelliği

Bir öğenin Sağ Dolgusunu tanımlar.
 
h1
{ 
padding-right: 10px
}
Olası değerler:
auto: Tarayıcı değeri belirler
uzunluk: Değişmez sağ dolgusunu tanımlar
%: Belgenin toplam eninin yüzde oranı kadar sağ dolgu bırakmaya yarar

Üst Dolgu (padding-top) Özelliği

Bir öğenin Üst dolgusunu tanımlar.
 
h1
{ 
padding-top: 10px
}
Olası değerler:
auto: Tarayıcı değeri belirler
uzunluk: Değişmez üst dolguyu tanımlar
%: Belgenin toplam boyunun yüzde oranı kadar üst dolgu bırakmaya yarar