背景图像和封面图像在小屏幕上消失

Question

我工作的网站有一个页脚背景图片，但在手机和平板电脑上没有显示。它之前工作得很好。我检查了所有内容 1000 次，但找不到问题所在。部分背景封面图片也发生了同样的事情。您可以在此处查看页面：http://amapolapr.com/Amapola-New/receta-bacalaitos.html HTML:
Paseando por las costas de Puerto Rico encuentras los kioscos o "chinchorros" que ofrecen deliciosos antojitos tipicos puertorriqueños como bacalaitos fritos, mariscos, tostones de plátano, alcapurrias y bebidas de toda clase。

    <!-- footer begin -->
    <footer>
        <div class="container">
            <div class="row">
                <div class="col-md-3">
                    <img src="images/Logo_Molinos.png" alt="Molinos de PR logo"><br/><br/>
                    P&aacute;gina oficial Molinos de Puerto Rico. 
                </div>

                <div class="col-md-3">
                    <div class="widget widget_recent_post">

                    </div>
                </div>

                <div class="col-md-3">
                    <div class="social">
                        <h3>S&iacute;guenos</h3>
                        <a href="#"><i class="fa fa-facebook-square" style="color:#363535 !important; font-size:36px;"></i></a>
                        <a href="#"><i class="fa fa-linkedin-square" style="color:#363535 !important; font-size:36px;"></i></a>
                    </div>
                </div>

                <div class="col-md-3">
                    <h3>Contacto</h3>
                    <div class="widget widget-address">
                        <address>
                            Molinos de Puerto Rico<br> San Juan, Puerto Rico 00921<br>
                            <span><strong>Phone: </strong>(787) 123-4567</span><br>
                            <span><strong>Fax: </strong>(787) 123-4567</span><br>
                            <span><a href="mailto:lc@krativeadpr.com" style="color:#363535">Envíanos un email</a></span>
                        </address>
                    </div>
                </div>
            </div>
        </div>

        <div class="subfooter">
            <div class="container">
                <div class="row">
                    <div class="col-md-6">
                        &copy; Copyright 2015 - Molinos de Puerto Rico.                    
                    </div>
                    <div class="col-md-6 hidden-xs">
                        <nav>
                            <ul>
                                <li><a href="index.html">Home</a></li>
                                <li><a href="aboutus.html">Compa&ntilde;&iacute;a</a></li>
                                <li><a href="#">Productos</a></li>
                                <li><a href="recetas.html">Recetas</a></li>
                                <li><a href="#">Comunidad</a></li>
                                <li><a href="#">Contacto</a></li>
                            </ul>
                        </nav>
                    </div>
                </div>
            </div>
        </div>

    </footer>
    <!-- footer close -->

CSS:

 #frase3 { 
        background-image:url('../images/Kioscos-3.jpg');
        background-size:cover !important;
        min-height: 500px;
        height: auto;
        margin: 0 auto;
        width: 100%;
        position: relative;
  }

谢谢！

Answer 1

只需从 @media (min-width: 1200px) #frase3 中删除媒体查询，使其成为 #frase3，您应该全部排序。

为了将来的帮助，请尝试在您认为运行良好的系统上调整浏览器 window 大小。它会突出显示任何此类问题，并表明它不是特定于设备的问题，这对您有帮助调试问题。

从外观上看，它位于第 403 行：

背景图像和封面图像在小屏幕上消失

background images and cover images disappear on small screens

css

media-queries

twitter-bootstrap-3