HTML CSS Kutu Modeli 2026 Güncel

CSS Aradalan Resminin Konum Ayarları

1 dk okuma süresi 687 görüntülenme 2024-01-08 4.9 (14 değerlendirme)

CSS arka plan resminin konumunu ayarlamak için background-position özelliği kullanılır. Bu özellik, arka plan resminin HTML öğesinin içindeki konumunu belirler. İki değer alabilir: yatay konum ve dikey konum.

İşte background-position özelliğinin kullanımı:

div { background-image: url('background.jpg'); /* Arka plan resmi ekleme */ background-position: right top; /* Yatayda sağa, dikeyde yukarı konum */ }

Bu örnekte, background-position özelliği ile arka plan resminin konumu belirlenmiştir. right değeri yatayda sağa, top değeri dikeyde yukarı konumu ifade eder. İsterseniz bu değerleri farklı birimlerle belirleyebilirsiniz.

Ayrıca, bu özellikle ilgili farklı birimler kullanabilirsiniz:

  • Piksel (px), yüzde (%), em (em) gibi uzunluk birimleri
  • left, center, right gibi kelime değerleri
  • Kombinasyonlar, örneğin 50% 50% (yatayda orta, dikeyde orta)

Örnek:

div { background-image: url('background.jpg'); background-position: 50% 50%; /* Yatayda orta, dikeyde orta konum */ }

Bu şekilde, arka plan resminin konumunu belirleyerek sayfanızın tasarımını daha fazla özelleştirebilirsiniz.

Bu Dersi Değerlendirin

Bu ders size yardımcı oldu mu? Puan verin!

Geri bildiriminiz içeriğimizi sürekli güncel ve kaliteli tutmamızı sağlar.

4.9 / 5 (Toplam 14 oy kullanıldı)

Sıkça Sorulan Sorular (SSS)

Bu ders ve konuyla ilgili en çok merak edilenler

CSS Aradalan Resminin Konum Ayarları dersini öğrenmek için ön koşul var mı?

Bu eğitim temel seviyeden ileri seviyeye adım adım hazırlanmıştır. Kodları kopyalayıp Canlı Editör üzerinde test ederek kolayca pratik yapabilirsiniz.

Örnek kodları kendi projelerimde ücretsiz kullanabilir miyim?

Evet, PHP Hocası üzerindeki tüm kod örnekleri açık kaynak mantığıyla sunulmaktadır. Ticari veya kişisel projelerinizde serbestçe kullanabilirsiniz.

Takıldığım bir yerde nereden soru sorabilirim?

Dersin altındaki topluluk yorumları bölümünden sorunuzu sorabilirsiniz. Eğitmenlerimiz ve topluluk üyelerimiz kısa sürede yanıt verecektir.

Paylaş:
PHP Hocası Akademi

Topluluk Yorumları (0)

Ders Hakkında Yorum Yap veya Soru Sor

Henüz yorum yapılmamış. İlk yorumu siz yazın!