CSS Dıştan Boşluk Bırakma Margin Özelliği

Bir HTML elementi ile çevresindeki diğer html elementleri arasına boşluk boşluk koymaya yarar.

Bu boşlukları üst, sol, alt ve sağ için ayrı ayrı belirleyebildiğimiz gibi tek bir css koduyla da bu boşluları belirleyebilriz.

Tüm margin komutları:
margin-top - Üst kısımdan boşluk bırakır.
margin-right - Sağ kısımdan boşluk bırakır.
margin-bottom - Alt kısımdan boşluk bırakır.
margin-left - Sol kısımdan boşluk bırakır.
margin - Tüm kısımlardan boşluk bırakır.


Alabileceği değerler:

auto - Tarayıcılar tarafından otomatik ayarlanır
px - piksel olarak boşluk belirtme
% - İçerik genişliğine göre yüzdelik oranlama ile


Ayrı Ayrı Dış Boşlukları Ayarlamak


Kod:
.divim
{
margin-top: 20px;
margin-bottom: 20px;

margin-left: 30px;
margin-right: 40px;
}

Yukarıdaki örnekte divin üst  ve alt kısmında 20px, sağ ve sol kısmında 30 piksellik boşluklar bırakacaktır.


Dış Boşlukları Tek Seferde Ayarlarmak için  sırasıyla üst, sağ, alt, sol şeklinde değerler yazarak da 4 bölgeyi tek satırda yazabiliriz.


Kod:
.divim
{
/* Dağılımı: margin: [üst] [sağ] [alt] [sol] */

margin: 20px 30px 20px 30px
}

 

Eğer div dışına vereceğimiz boşlukta yukarı ve alt değerler ile Sağ ve sol değerler aynı olacaksa aşağıdaki şekilde kullanabiliriz.

Kod:
.divim
{
/* Dağılımı: margin: [üst|alt] [sağ|sol] */

margin: 10px 20px;
}

Programın Çıktısı

Mesaj ve Yorumlar

Yorum Sayısı (0)

ÜYE YORUMLARI

Çevrimiçi :
10
Günlük :
110
Haftalık :
349
Aylık :
1140
Copyright © 2010 İşbara Alp Sönmez – Programlama Örnekleri. Her hakkı saklıdır. www.alpsonmez.com Bu sitedeki herhangi bir içeriğin, "herhangi bir sitede veya forumda" iznim dışında paylaşım yapılması durumunda hukuki dava açacağımı tarafınıza arz ederim. "Öğrenciler dilediği gibi kullanabilir."