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

Yeniçocuk · 8 Aralık 2021

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. */
}

Mahir Çınar Girgin · 8 Aralık 2021

CSS kodlarınızda resminize object-fit: fill verdiğinizde olacaktır. Daha önce denemedim. İnternetten bulduğum birkaç bilgiye göre iletiyorum.

KAYNAK
[CODE lang="css" title="CSS KODLARI"].SliderArea
{
width: 100%;
}
.SliderContainer
{
width: 100%;
}
.SliderImg img {
object-fit: fill;
}[/CODE]

Bu şekilde vermeniz gerekiyor.

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

Ayrıntılı düzenleme

Yeniçocuk

Kilopat

Mahir Çınar Girgin

Decapat

Benzer konular

Yeni konular

Yeni mesajlar

Gizliliğinize önem veriyoruz