Resimleri Bozmadan Kırpma: object-fit: cover; Kullanımı
object-fit: cover; CSS özelliği, özellikle <img> ve <video> gibi medya öğelerinde kullanılır ve içeriğin belirlenen genişlik ve yükseklik oranlarına uyum sağlamasını sağlar.
Ne İşe Yarar?
Resmin veya videonun belirlenen bir konteynerin içine sığmasını ve kırpılmasını sağlar.
Orantıyı bozmadan içeriğin tamamen görünmesini sağlar.
İçeriği taşırmadan ve boşluk bırakmadan gösterir.
Nasıl Çalışır?
Resim, orijinal en-boy oranını koruyarak belirtilen alanı doldurur.
Eğer resmin oranı belirtilen konteynerle uyuşmazsa, taşan kısımlar kırpılır ama resim deforme olmaz.
Resim kendi merkezine göre hizalanır, yani ortalanmış olur.
Kullanım Amaçları
Responsive Tasarımlar
Farklı ekran boyutlarında resimlerin bozulmadan ve kaymadan görünmesini...
