İlgili resmin genişlik/yükseklik bilmeden bir belge img etiketi koyuyorum:

<img src="/myimage.png" />

CSS tam olarak yarısı onun için görüntü "" boyutu (alttaki resim boyutu). yerel ölçek için kullanmak istiyorum Bunun nasıl olduğunu çözemedim.

• width: 50% kullanarak olur boyutu içeren blok göre, resmi değil.
• Resim boyutunu bilmiyorum, çünkü belirli bir piksel genişliği boyutu edemem.

• Ben sadece Y desteklemek için gereken bu yana, bir dönüşüm kullanarak denedim:

  -webkit-transform: scale(0.5);
  

  Bu güzel resim yapar, ama görüntü öğesinin boyutunu yeniden boyutlandırmak yok.

• @Radagaisus öneriyor iyi bir geri dönüş olduğu kullanarak Javascript,. Bu sayfa ekleme ve tüm yüklendiğinde ile ilgili kullanamam yani ultra hafif ve taşınabilir bir sayfada ancak() işleyicileri el ile bir ağrı olabilir.

Bu yüzden? bir postscript olarak: Retina ekran ile ilgilenmeni istiyorum çünkü. devicePixelRatio kullanarak tespit etmek ve daha büyük (2x) resimleri doldurabilirim, ama onları P ekranda doğru bakmak küçültün ihtiyacım var.

Hedef cihazı uygun olarak Adam Ernst için mükemmel bir yer, sanki zoom özelliği geliyor. Ancak, bunun için bir çözüm lazım ve mümkün olduğu kadar çok cihaz desteği olanlar için aşağıdakileri yapabilirsiniz:

<img src="..." onload="this.width/=2;this.onload=null;" />

this.onload=null ayrıca nedeni bazen iki kez yükleme olayı tetikleyen eski tarayıcılar önlemek içinçeyreklik boyutlu görüntüler ile sona erebilir anlamına gelir). Yazabilirsiniz ama bu konuda endişeli değil:

<img src="..." onload="this.width/=2;" />

Oldukça kısa ve öz.