Resmin div elemanının özelliklerine göre değer alması nasıl sağlanır?

Yeniçocuk

Hectopat
Katılım
30 Kasım 2018
Mesajlar
2.177
Makaleler
2
Çözümler
2
Yer
ETS2'de para kazanmaya gitti.
Merhabalar slider yapacağım. Resim için ayarladığım div genişlik boyutu 100% yükseklik 400px yaptım. Resim boyutu 1100 X 1100 bu resmi hiçbir bozulma olmadan nasıl div elemanına uygun olarak ayarlayabilirim? Kodlar;

HTML

HTML:
    <section class="SliderArea">
        <div class="SliderContainer">
            <div class="SliderImg"><img src="img/slider6.jpg" alt=""></div>
        </div>
    </section>



CSS

Kod:
.SliderArea
{
    width: 100%;
}
.SliderContainer
{
    width: 100%;
}
.SliderImg
{
    /* Buraya hangi değer gireceği için boş bıraktım. */
}
 
Katılım
16 Temmuz 2021
Mesajlar
352
Çözümler
4
Yer
Ankara - Türkiye
CSS kodlarınızda resminize object-fit: fill verdiğinizde olacaktır. Daha önce denemedim. İnternetten bulduğum birkaç bilgiye göre iletiyorum.

KAYNAK
CSS KODLARI:
.SliderArea
{
    width: 100%;
}
.SliderContainer
{
    width: 100%;
}
.SliderImg img {
    object-fit: fill;
}

Bu şekilde vermeniz gerekiyor.
 
Son düzenleme:
Yukarı