Bir resmim var ve pencerenin boyutu ne olursa olsun genişliğin tarayıcı penceresini doldurmasını istiyorum.Tarayıcı penceresinin genişliğini doldurmak için bir görüntü uzatın
Bunu HTML ve CSS'de nasıl yapabilirim?
Bir resmim var ve pencerenin boyutu ne olursa olsun genişliğin tarayıcı penceresini doldurmasını istiyorum.Tarayıcı penceresinin genişliğini doldurmak için bir görüntü uzatın
Bunu HTML ve CSS'de nasıl yapabilirim?
<img src="filename.jpg" alt="alt text" width="100%" />
Bu, görüntünün kabının tarayıcı penceresi kadar geniş olduğunu varsayar.
Sen genişliğinde% 100'lük bir yüksekliğe bir div ekleyebilirsinizbu, HTML 5 için geçerli değildir. HTML5'de, değer piksel cinsinden olmalıdır. – sbagdat
@sbagdat İlginç. Bunu bilmiyordum. Yüzde neden seçenek olarak kaldırıldı? –
muhtemelen resimler büyüdükçe kaliteyi kaybediyorlar. Burada w3c linki: http://www.w3schools.com/html5/att_img_width.asp – sbagdat
, ayrıca set görüntünün genişliği ve yüksekliği% 100
<div id="wrapper">
<img src="http://lorempixel.com/200/200" />
</div>
CSS:
#wrapper, img{
width:100%;
height: 100%;
}
<div class="fixpixel">
<img src="ImagePath" />
</div>
CSS dosyası
.fixpixel img{
height: auto;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
[img yüksekliği pencere yüksekliğinden daha az olduğunda [CSS veya jQuery ölçeklenebilir arka plan görüntüsünün altında NO beyaz boşluk ile olası kopyası] (http://stackoverflow.com/questions/5072750/css-or-jquery-scalable-background- image-with-no-beyaz-boşluk-altında-altında-img) – Joseph