Question

我的网站有问题。在网站上只显示一个（第一个）图像，即使下面的图像是相同的（我的意思是相同的src，就像第一个一样）。

网站上有图片背景部分。

代码：

#kafelobrazintro { 
background: url(../images/introtablet.jpg) 50% 0 no-repeat fixed; 
height: 1000px;
margin: 0 auto; 
width: 100%; 
max-width: 1920px; 
position: relative; 
box-shadow: 0 0 50px rgba(0,0,0,0.8);
overflow:hidden;
}

这是使用img的部分，但即使我将此css复制到另一部分，网站仍然只会显示一个img。

网站上的图片低于2 MPX，分辨率：1024 x 614像素，尺寸小于100kb。

如果你有iPad检查我的网站，并知道我在说什么：＆gt;网站只显示第一个img：？

为什么它不起作用？

地址：http://www.badzlepszy.pl/Nebiolo/

Answer 1

问题在于background-attachment: fixed;。如果删除fixed背景图片，则可以使用。

使用媒体查询以适当的窗口大小更改此属性。

Answer 2

仍然没有解决问题。 iPad上的第一张图片显示，但有些人不会。

如果您有iPad，可以查看：website

我为iPad创建了tableb.css：

<link media="only screen and (device-width: 768px)" href="css/tablet.css" type= "text/css" rel="stylesheet" />

平板电脑中img部分的CSS：

#kafelobrazintro { 
background: url(../images/introtablet.jpg) 50% 0 no-repeat; 
height: 1000px;
margin: 0 auto; 
width: 100%; 
max-width: 1920px; 
position: relative; 
box-shadow: 0 0 50px rgba(0,0,0,0.8);
overflow:hidden;
}

#kafelobraz1 { 
background: url(../images/logomzblue.jpg) 50% 0 no-repeat;  
height: 1000px;
margin: 0 auto; 
width: 100%; 
max-width: 1920px; 
position: relative; 
box-shadow: 0 0 50px rgba(0,0,0,0.8);
overflow:hidden;
}

Answer 3

同样的问题在这里有点不同。我的div-s背景图片是空的（没有文字和没有HTML内容）

这里的解决方案是添加：min-width：1024;对这些div-s。

（我在http://www.browserstack.com/上使用iPad Air和iPad 4测试了您的网站，看起来不错）

为什么我的网站在iPad上只显示一张图片？

3 个答案: