html - 当尺寸缩小到手机时图片消失

Question

当我缩小到移动设备时，我的第一个类为“armando”的 div 消失了。

所有剩余的 div 都可以正确调整大小，我没有针对那个 div 的任何媒体查询。

下面是我的代码:

<div class="container-fluid">
      <div class="row padRight ">
        <div class="container-fluid armando col-lg-4 col-md-6 col-sm-12 col-xs-12"></div>
        <div class="container-fluid col-lg-4 col-md-6 col-sm-12 col-xs-12">

        <div class="text-center"><h4>Local Amenities</h4>
        </div>

          <p class="marRL"><a href="https://pt-pt.facebook.com/PORTA10Hotdogs/" target="_blank">Porta 10 </a>is a little gem of a snack bar it's within a couple of minutes walk from the apartment.
          The owner Armando is a gentleman, very friendly and accommodating and will adjust any dish to suit you.<br>

          Really nice and clean venue, food and drinks are very cheap and they have a particularly good variety of hot dogs. There is plenty of other dishes to choose from including breakfast.

          If you are looking for a good value meal I couldn't recommend it more.
          <br>Maxi Pizza next door also do great pizzas for eating in or take away if you dont fancy going out.
          Then you have BC's a few doors down really nice portuguese resturant with great food and great prices.<br>
          The bus stop for the old Town is directly opposite on the other side of the road, making Porta 10 very handy for a swift one on the way down Town.
          </p>

        </div>
        <div class="mdframe container-fluid col-lg-4 col-md-12 col-sm-12 col-xs-12 porta10"></div>ter code here

   //CSS 
    .armando {
         background-image: url("../images/rsz_armando.jpg");
         background-repeat: no-repeat;
         background-position: center;
         background-size: contain;
     }

Answer 1

因为您正在使用背景图像显示图像，所以您需要指定显示图像的 div 的 min-height，尤其是当您没有里面的内容。

添加 min-height 值将强制 div 拉伸(stretch)，从而显示 background-image。