使div背景图像响应bootstrap 3

如何让div与背景图像响应bootstrap 3？使div背景图像响应bootstrap 3

在bootstrap 3中可以使用img-responsive类吗？

我的格是空的象下面这样：

<div class="row"> 
    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> 
     <div class="workflowstep workflowstep1 img-responsive">&nbsp; 
     </div> 
     <div class="workflowstep workflowstep2 img-responsive">&nbsp; 
     </div> 
     <div class="workflowstep workflowstep3 img-responsive">&nbsp; 
     </div> 
     <div class="workflowstep workflowstep4 img-responsive">&nbsp; 
     </div> 
     <div class="workflowstep workflowstep5 img-responsive">&nbsp; 
     </div> 
     <div class="workflowstep workflowstep6 img-responsive">&nbsp; 
     </div> 
    </div> 
</div>

来源

2013-11-03 b24

我认为它不是这样使用img-responsive这里，因为它是为<img />

和制造响应的div背景图片，我们可以使用background-size: cover;

背景大小：盖;

缩放图像，同时保持其固有的纵横尺寸比（如果有的话），到最小的尺寸，使得它的宽度和高度可以完全覆盖背景定位区域

来源

2013-11-03 12:34:14

为了使背景图像响应，您可以使用background-size: cover CSS属性。或者如果要在div中调整背景图像的大小，请使用background-size: 100% 100%。

欲了解更多有关background-size的资讯，请通过此链接浏览此link。

来源

2013-11-03 12:09:22

背景尺寸都不会在IE8及更高版本中工作，但是您可以使用CSS3PIE添加一个polyfill（但使用CSS3PIE会导致轻微的性能下降）。 – redshift

使div背景图像响应bootstrap 3

回答

相关问题