Question

我有2000 * 8000像素的图像。我想使宽度与加载窗口相同，而高度必须是可滚动的。我的意思是在页面加载宽度后：100％和高度：25％必须只显示图像。然后，当我向下滚动时，必须显示高度的其余部分，即图像只应向下滚动而不是向侧面滚动。

＆＃13;

.img {
  max-width: 100%;
  max-height: 100%;
  height: inherit !important;
}

html {
  background: url(importantwebsite.jpg);
  background-size: 100%;
  /*-webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;*/		
}

＆＃13;

我使用了上面的代码，但它显示了100％的宽度和25％的高度，并且未显示图像的其余部分。请帮忙.. !!

Answer 1

演示 - http://jsfiddle.net/victor_007/uoco335z/

更改图片的width:100%和height:auto

.img {
  width: 100%;
  height: auto;
}

<img class="img" src="http://placeimg.com/2000/8000/any">

Answer 2

删除max-height:100%并应用height:100% !important，如下所示。

  .img{
    max-width: 100%;
    height:100% !important;
  }

DEMO

在高度可滚动的同时添加图像使宽度与屏幕相同

2 个答案: