相同尺寸的图片，但显示不同！为什么？

-1

我不得不根据屏幕尺寸设置4个页面，其宽度和高度均为100％。的IMGS都得到了相同的宽度和高度，这些都是我的设置，相同尺寸的图片，但显示不同！为什么？

.fullImg{ 
width: 100%; 
height: auto; 
max-height: 100vh; 
max-width: 100vw;

}

这是对几张照片，但不与他人正常使用，这怎么可能，如果图片得到了相同的尺寸是多少？我试图做背景大小：封面工作了一段时间，但它会切断img，所以目前最好的方式是我上面写的一个。我正在谈论从1440px到2560px的大屏幕尺寸。非常感谢

你可以看看这里的标题：http://provaresponsive.herokuapp.com/pr.html

来源

2016-10-11 Matteo Soresini

提供jsfiddle –

我该怎么办？对不起，我在这里是新的 –

这在技术上是不可能的，所以在某些地方我们无法看到有限的信息。我的建议是使用CSS背景图像属性。你可以在这里看到一个很好的教程https://css-tricks.com/perfect-full-page-background-image/ – asimovwasright

利用直道JS。它可以修复你的issue.if您使用直道JS调用您的背景图片，然后它会自动调整图像艾科无论你的图像分辨率是

来源

2016-10-13 09:35:05

非常感谢。它实际上帮助 –

，它确实有效，但我仍然有问题。第一个背景必须适应屏幕，并且直到现在都是完美的，但是当然我还有其他div和其下面的内容，它将溢出第一个背景，即backstretch设置为位置：绝对！我怎样才能解决这个问题？ –

你能告诉我你写的HTML代码吗？ –

正如意见，如果你想要一个形象总是利用一切可以利用的高度和宽度所提到的，那么你就必须决定：是否希望图像保持宽高比 - 然后它必须被裁剪，或者您是否希望图像改变宽高比，在这种情况下它会拉伸。

下面是每个选项的例子：

没有拉伸 - 将作物

html { 
    background: url(http://www.olejarz.com/arted/perspective/images/intro.gif) no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
}

jsfiddle

拉伸 - 不裁剪

div { 
background-image:url(http://www.olejarz.com/arted/perspective/images/intro.gif); 
/* 
    * Width & Height can be percetages only when the parent 
    * element has explicitly declared dimensions. 
    */ 
    height:200px; 
    width:500px; 
    -moz-background-size:100% 100%; 
    -webkit-background-size:100% 100%; 
    background-size:100% 100%; 
}

jsfiddle

而且还有第三个选择，你可能会不喜欢，这是包含图像，所以：

没有拉伸，不裁剪 - 不填充X/Y

html { 
    background: url(http://www.olejarz.com/arted/perspective/images/intro.gif) no-repeat center center fixed; 
    -webkit-background-size: contain; 
    -moz-background-size: contain; 
    -o-background-size: contain; 
    background-size: contain; 
}

jsfiddle

来源

2016-10-13 08:04:08 asimovwasright

非常感谢。它帮助 –

相同尺寸的图片，但显示不同！为什么？

回答

相关问题