Div 背景图像不会在手机上显示

Question

我有一个带有背景图像集的 div 类。它在电脑浏览器上显示正常，但它不会在移动浏览器上显示图像（我尝试过 android 和 ios）

html

<div class="wrapper">
   <div class="headerdiv">
      <?php include '../inc/header.php';?>
   </div>
   <div id="wherewhen">
      <div id="when">
         <span class="wherewhen">WHEN IS IT?</span><br /> 
         <span class="wherewhentext">9TH/10TH FEBUARY 2014</span>
  </div>
  <div id="where">
         <span class="wherewhen">WHERE IS IT?</span><br /> 
         <span class="wherewhentext">HOLIDAY INN, MILTON KEYNES, ENGLAND</span>
  </div>
  <div id="what">
         <span class="wherewhen">WHAT IS IT?</span>
      </div>
  <div id="info">
         <span class="wherewhentext"> 
         A BACK IN THE DAY STYLE CONVENTION 
         FOR DISENFRANCHISED ARTISTS AND TATTOO FANS FED UP 
         WITH TODAY'S COMMERCIAL CORPORATE EXPOS.
         </span>
  </div>
  </div>
  <div class="poster">
  </div>

CSS

html, body{
margin:0; 
padding:0;
width:100%;
height:100%;
overflow:auto;
background:#000000;
}

.wrapper{
width:80em;
margin: 0 auto 0 auto;
background:#000000;
overflow:hidden;
}

.poster{
float:left;
margin:-900px 0 0 910px;
width:370px;
min-height:600px;
background:#ffffff url('../images/siteimages/background.png');
}

#wherewhen{
background:#392da3;
width:600px;
margin:20px 20px 0 295px;
text-shadow: 2px -2px #000000;

}

#where{
float:left;
text-align:center;
width:20em;
}

#when{
float:right;
text-align:center;
width:15em;
}

#what{
width:20em;
text-align:center;
margin:0 auto 0 auto;
}

#info{
width:30em;
margin:0 auto 0 auto;
}

有人可以在这里提供帮助吗？

谢谢...

Answer 1

oki，#poster 背景可以在#wrapper 和background-attachement:fixed。

您的代码中的其他内容（#poster outside #wrapper ）

#wrapper {
position:relative;
z-index:1;
/* your rules */
}
#poster  {
position:fixed;
z-index:0;
top:0;
left:0;
/* your rules */
}