背景图片和封面图片在小屏幕上消失
我工作的网站有一个背景图片,用于未在手机和平板电脑上显示的页脚。它之前工作完美。我查了1000次,并找不到问题。部分背景封面图片也发生了同样的情况。 您可以查看这里的页面:http://amapolapr.com/Amapola-New/receta-bacalaitos.html HTML:
Paseando POR拉斯木香波多黎各encuentras洛杉矶kioscos o “的chinchorros” 阙ofrecen deliciosos antojitos tipicos波多黎各人科莫bacalaitos fritos,MARISCOS,tostones德普拉塔诺,alcapurriasÿ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á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í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:[email protected]" 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">
© 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ñí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;
}
谢谢!
只需从@media (min-width: 1200px) #frase3
中删除媒体查询,使其成为#frase3
,您应该全部排序。
对于将来的帮助,请尝试调整您认为功能正常的系统上的浏览器窗口大小。它将突出显示此类问题,并显示它不是可帮助您调试问题的设备特定问题。
这是在行403的事情看起来:
请原谅我疲惫的眼睛...但我找不到那是... –
非常感谢! –
背景图像是包装在@media(最小宽度:1200像素) – aahhaa
所以它只有在你的屏幕比1200像素大展示。 – aahhaa
请原谅我疲惫的眼睛......但我找不到那个...... –