Skip to main content

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”>

Like
Like Love Haha Wow Sad Angry
Buda İlginizi Çekebilir ?  HTML Türkçe Karakter Sorununun Çözümü

5 thoughts to “Resimleri Responsive Uyumlu Hale Getirmek”

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.