Devam Et
Logo

CSS'de Margin | Padding Farkı

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.

Author

Muhammed Yusuf TAŞKESENLİGİL

Hakkında: Hakkında: 2015 Haziran ayında KTÜ Bilgisayar Mühendisliği bölümünden mezun oldum. Yaklaşık 4 yıldır web teknolojileri üzerinde çalışıyorum. HTML, CSS, JavaScript ve PHP alanlarında proje geliştiriyorum. Teknolojiyi seven ve hayatının her alanında kullanan biriyim.

Bootstrap ve Javascript Kayan Yan Menü (Side Menu) Önceki Yazı
HTML5 ile Bildirim (Notification) Gönderme Sonraki Yazı

0 Yorum

    Henüz hiç yorum eklenmemiş!

Bir Yorumda Sen Bırak