使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

回答

相關問題