Arama

CSS'de Margin | Padding Farkı

  • Paylaş:
post-title

Merhaba arkadaşlar, bugün CSS'de en çok karıştırılan ve farkı ayırt edilemeyen bir konuyu açıklığa kavuşturacağız, hadi buyrun ...

Arkadaşlar hiç lafı uzatmadan konuya girelim;

CSS'de margin dış boşluk anlamına gelir. Yani kod içerisindeki bir elementin, dışındaki diğer elementlerle arasındaki boşluğu ifade eder. Padding ise iç boşluk demektir. Yani bir elementin içerisinde bulunan elementlerle arasındaki boşluğu ifade eder. Konuyu şöyle örneklendirelim isterseniz;

Şekildeki gibi iki div tanımladığımızı varsayalım. Şuanda burada margin ve padding setlemeleri olmadığından divler birbirine yapışık ve yazılarda bu divlere yapışık olarak geliyor.

Şmdi bunlara margin ve padding değerleri vererek değişimlerini görelim.

 

Soladaki resimde 1. div'e margin bottom verdim ve alttaki div bir miktar aşağı kaydı. Görüldüğü gibi margin dıştaki elemanın ötelenmesini sağlıyor. 

 

 

Burada ise 2. div'e padding setlemesi yapıyoruz ve div'in için deki yazı öteleniyor. Yani burada da padding ile içteki elemanın ötelenmesini (iç boşluk oluşmasını) sağlıyoruz.

 

 

Bu kodların bulunduğu proje dosyasını rarlayarak sizlere veriyorum. Oradaki kodları da incelerseniz kendinizde uygulayarak öğrenmiş olursunuz. İşle link

Evet arkadaşlar anlatacaklarım bu kadar. Sormak istediğiniz birşey olursa yorum kısmına yazarak sorabilrsiniz.

Etiketler:
Bir yorum bırak