CSS’de Resim Boyutlandırma

css-image-resize

izin de benim gibi zaman zaman, CSS’de resim küçültmeye ihtiyacınız olabilir. Gelen resim büyük bir resim olsa da ekrana getirirken belli bir oranda küçültmek isteyebilirsiniz. Bunun için güzel CSS kodları var, hem kendime not olsun, hem arayana da yardımcı olalım diye anlatayım.

 

Bu işlemi yapmanın jquery, javascript ve benzer birçok yolu var ama en güzel ve basiti şöyle yapılıyor, kendimize bir selector oluşturuyoruz;

[css]

#kucult
{
max-width: 300px;
width: expression(this.width > 300 ? 300: true);
max-height:59px;
height: expression(this.height > 59 ? 59: true);
}

[/css]

Burda eklenecek resimi 300 px genişliğine ve 59 px yüksekliğine küçültüyoruz. Şimdi de nasıl kullanılacağına bakalım;

[html]

<img src=”http://xxx.com/css-image-resize.jpg” id=”kucult”>

[/html]

img id kısmını, oluşturduğumuz selector ile besledik. Bu kadar basit.

Facebook Profile photo

#r00tadmin #Basit Bir kuL #Allah (c.c) Bir kuLu işte bazen bir adem bazen bir aLem !

Facebook Profile photo

Author: Guest

#r00tadmin #Basit Bir kuL #Allah (c.c) Bir kuLu işte bazen bir adem bazen bir aLem !

Bir cevap yazın

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