Question

黑色背景无法在手机/平板电脑上正常显示（例如在iphone，nexus等）虽然它适用于笔记本电脑/计算机浏览器。

<html>
<body>

<div id="directory">        
 <div id="background">
      <div id="bgtop">
        <div id="nav">
          <ul class="navlist">
            <li class="first active"><a href="/">Home</a></li>
            <li><a href="/about-us/">About us</a></li>
            <li><a href="/how-it-works/">How it works</a></li>

            <li><a href="/pricing/">Pricing</a></li>
            <li class="last"><a href="/contact-us/">Contact Us</a></li>
            <li class="last"><a href="/blog/">Blog</a></li>
          </ul>


    <div class="loginDiv">
                    <a class="loginA" href="/login/" id="signinbutton"><span class="loginSpan">Sign In</span></a>
            <a class="loginA" href="/register/" id="registerbutton"><span class="loginSpan">Register</span></a> 
        </div>
        </div>



        <div class="clr"></div>
      </div><!--/bgtop-->
    </div><!--/background-->
</div>
</body>
</html>

任何帮助表示感谢。

三江源

Answer 1

好的，我明白了......你所要做的就是：

在您的身体选择器中添加最小宽度。

body{min-width:1069px}

更新了小提琴：http://jsfiddle.net/QJMQ6/1/

实际上，当设备的宽度较小时，身体的宽度也会变小，因为它的宽度是<html />的100％。由于overflow:visible作为body的默认属性，因此会出现这种情况。做body{overflow:hidden}，事情将被隐藏，但背景将正常工作。最好在那里设置min-width身体。

你的小提琴更新：http://jsfiddle.net/Q6LND/1/

css问题与移动浏览器上的背景图像

1 个答案: