# 022: Esnek Görüntüler (Şekiller ve Figürler) - CSS Hileleri

Anonim

Bazı tipografi çalışması yapmadan önce, resimlerin makale alanı ve ızgaranın dışında patladığı can sıkıcı şeyi düzelteceğimizi düşündüm. Satır içi resim niteliklerini ve stilini geçersiz kılmak için bazı basit CSS kurallarını kullanarak, resimleri gönderimize doğru boyutta sığdırmak için sıkıştırabiliriz.

Tarayıcılar yeniden boyutlandırma konusunda kötü bir iş çıkardığı için, eskiden bu tür görüntüleri sıkıştırmak pek hoş değildi, ancak artık durum böyle değil. Görüntüler daha keskin olacağından, ekranlar daha yüksek çözünürlük kazandığından bu aslında iyi bir fikir.

Yeniden boyutlandırma esasen şu şekilde ele alınır:

figure img ( max-width: 100%; height: auto !important; )

Figürleri ve figürleri bir blog gönderisindeki uygun bir figür gibi görünmelerini sağlamak için biraz biçimlendiriyoruz.