Skip to main content
Opencart Eğitimi

Resimleri Responsive Uyumlu Hale Getirmek

Resimleri responsive hale getirmek için css dosyamıza aşağıdaki kodları ekleyerek mobil aygıtlara uyumlu hale getirebiliriz. CSS Dosyasının İçerisine Yazılacak Kod ;


img {
max-width: 100%;
height:auto;
box-sizing:border-box;
display:block;
}

Css özelliğini ana etiket olan img tagına tanımladığımız için html kısmına herhangi bir class veya ıd vermemize gerek yoktur.

Not : Bootstrap kütüphanelerini kullandığınız sitelerde class olarak “img-responsive” kullanırsanız resimleriniz hiç bir kod yazmaya gerek duymadan responsive hale gelecektir.

Örnek Kullanım : < img src=”ornek.jpg” class=”img-responsive”>

Resimleri Responsive Uyumlu Hale Getirmek” hakkında 5 yorum

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

This site uses Akismet to reduce spam. Learn how your comment data is processed.