Kenar Boşluğu vs Dolgu
Kenar boşluğu ve dolgu arasındaki fark, CSS'de önemli bir husustur, çünkü kenar boşluğu ve dolgu, CSS'de farklı öğeler arasında boşluk sağlamak için kullanılan iki önemli kavramdır. Dolgu ve kenar boşlukları birbirinin yerine kullanılamaz ve farklı amaçlara sahiptir, bu nedenle uygun şekilde kullanılmalıdır. Dolgu, bir bloğun içeriği ile kenarlığı arasındaki boşluktur. Öte yandan kenar boşluğu, bir bloğun sınırının dışındaki boşluktur. Kenar boşluğu, blokları bitişik bloklardan ayırırken dolgu, kenarlığı içerikten ayırır.
Dolgu nedir?
CSS'de (Basamaklı Stil Sayfaları), dolgu, içerik ile kenarlık arasında tutulan boşluktur. Bir bloğun içeriğini kenarından ayırır. Dolgu saydamdır ve öğenin arka plan görüntüsünü veya arka plan rengini de içerir. Bir elemanın dolgu miktarı, CSS kodunda "dolgu" terimi kullanılarak belirtilir. Örneğin, içeriğin etrafına 25 piksellik bir dolgu eklemek için aşağıdaki kod kullanılabilir.
div {
width: 300px;
yükseklik: 300 piksel;
dolgu: 25 piksel;
border: 25 piksel katı;
}
Gerekirse sol, sağ, üst ve alt için de farklı dolgu değerleri ayrı ayrı belirtilebilir. Aşağıdaki kod parçası, her bir taraf için farklı dolgu değerleri belirtir.
div {
width: 300px;
yükseklik: 300 piksel;
padding-top: 25px;
dolgu- alt: 35px;
sol dolgu: 5px;
padding-right: 10px;
border: 25 piksel katı;
}
Marj Nedir?
CSS'de (Basamaklı Stil Sayfaları), kenar boşluğu, sınırın dışındaki alandır. Bir bloğu diğer bloklardan ayırır. Kenar boşluğu da saydamdır, ancak dolgu ile büyük bir fark, kenar boşluğunun öğeye uygulanan arka plan resimlerini veya arka plan renklerini içermemesidir. CSS'deki marj miktarı, "marj" terimi kullanılarak belirtilir. Aşağıdaki kod parçası, div bloğunun etrafına 25 piksellik bir kenar boşluğu uyguladı.
div {
genişlik: 320 piksel;
yükseklik: 320 piksel;
kenarlık: 5 piksel katı;
marj: 25px;
}
Bloğun farklı tarafları için de farklı değerler belirtilebilir. Aşağıdaki kod parçası, her bir taraf için farklı kenar boşluğu değerleri uygular.
div {
genişlik: 320 piksel;
yükseklik: 320 piksel;
kenarlık: 5 piksel katı;
margin-top: 25px;
margin- alt: 35px;
sol kenar boşluğu: 5px;
margin-right: 10px;
}
Kenar Boşluğu ve Dolgu arasındaki fark nedir?
• Doldurma, kenarlıkla içerik arasındaki boşluktur, kenar boşluğu ise sınırın dışındaki boşluktur.
• Doldurma, bir bloğun içeriğini sınırdan ayırır. Kenar boşluğu bir bloğu diğerinden ayırır.
• Doldurma, arka plan resimleri ve içeriğe uygulanan arka plan renklerinden oluşurken kenar boşluğu bu tür içerik içermez.
• Bitişik blokların kenar boşlukları üst üste gelebilir, ancak dolgu örtüşmez.
Özet:
Dolgu ve Kenar Boşluğu
Padding, sınırı içerikten ayıran bir bloğun kenarlığının içindeki boşluktur. Kenar boşluğu, bir bloğu bitişik bloklardan ayıran sınırın dışındaki boşluktur. Diğer bir fark, dolgunun içeriğin etrafına uygulanan arka plan görüntüsünü ve arka plan renklerini içermesi, kenar boşluğu bunları içermemesidir. Tarayıcı sayfayı oluşturduğunda bazen bitişik blokların kenar boşlukları çakışabilir, ancak dolgu için böyle bir şey olmaz.
