Bootstrap 背景图像未在 iPhone 上调整大小答案

【问题标题】：Bootstrap Background Image not resizing on iPhoneBootstrap 背景图像未在 iPhone 上调整大小
【发布时间】：2017-01-16 13:09:10
【问题描述】：

我使用 Bootstrap 创建了一个接近完成的网站。我遇到的问题是，在桌面或 Android 设备上它看起来很棒并且按计划工作。但是，在 Iphone 上，背景图像不会缩小以适应显示器。该网站使用级联滚动。

www.mabmetalworks.com

我怀疑这与 iphone 是视网膜显示器有关？

你能看看我下面的代码，并告诉我如何纠正它以与 iPhone 一起工作吗？

<div id="home" class="home">
  <div class="text-vcenter">
   <h1>MAB Metal Works</h1>
   <h3 class = "H2">Your Local Steel Company</h3>
   <a href="#about" class="btn btn-default btn-lg">Continue</a>
   </div>
 </div>

 #home {
 background: url(../images/main.jpg) no-repeat center center scroll; 
 display: table;
 height: 100%;
 position: relative;
 width: 100%;
 max-width: 100%;
 -webkit-background-size: cover;
 -moz-background-size: cover;
 -o-background-size: cover;
 background-size: cover;
 }

【问题讨论】：

标签： html ios css iphone twitter-bootstrap

【解决方案1】：

还有一个特定于图像的类。

<img class="img-responsive">

你可以试试这个。如果这是你的答案，我不知道。

文章链接：http://www.w3schools.com/bootstrap/bootstrap_ref_css_images.asp

【讨论】：