X
Ankara Web Tasarım Blog Foto

Yazar: 16 Haziran 2023

Margin css Kullanımı

CSS’de margin özelliği, bir HTML öğesinin etrafında boşluk oluşturmak için kullanılır. margin özelliği, öğelerin diğer öğelerle olan mesafesini kontrol etmek için kullanılır. Bu özellik, dış boşluklar oluşturarak öğeleri birbirinden ayırır ve sayfa düzeninin daha iyi kontrol edilmesini sağlar.

margin özelliği, aşağıdaki şekilde kullanılabilir:

  1. margin-top: Öğenin üst kenarında boşluk oluşturur.
  2. margin-right: Öğenin sağ kenarında boşluk oluşturur.
  3. margin-bottom: Öğenin alt kenarında boşluk oluşturur.
  4. margin-left: Öğenin sol kenarında boşluk oluşturur.

Bu özelliklere piksel (px), yüzde (%) veya diğer uzunluk birimleriyle değerler atanabilir. Örneğin:

div {
  margin-top: 10px;
  margin-right: 20px;
  margin-bottom: 10px;
  margin-left: 20px;
}

Yukarıdaki CSS örneği, <div> öğesine 10 piksel üst, 20 piksel sağ, 10 piksel alt ve 20 piksel sol kenarda boşluk oluşturur.

Ayrıca, kısa bir formda tüm kenarlara aynı boşluğu uygulamak için margin özelliği kullanılabilir. Örneğin:

div {
  margin: 10px;
}

Bu örnekte, <div> öğesinin tüm kenarlarında 10 piksel boşluk oluşturulur.

margin özelliği ayrıca negatif değerlerle de kullanılabilir. Negatif margin değerleri, öğeleri birbirine yaklaştırmak veya bir öğeyi diğer öğelerin üzerine bindirmek için kullanılabilir.

margin özelliği, CSS’in kutu modelinde önemli bir rol oynar ve öğelerin birbirlerine olan mesafelerini kontrol etmek için kullanılır. Sayfa düzeni ve tasarımı için margin özelliği büyük bir esneklik sağlar ve öğeler arasındaki boşlukları ayarlamak için sıkça kullanılır.

Daha Fazla Bilgi İçin Web Tasarım Ankara Ekibimizle İletişime Geçebilirsiniz.