使div背景图像响应与bootstrap 3 [英] make div background image responsive with bootstrap 3

问题描述

如何使div与背景图像响应与引导3 ??

How make div with background image responsive with bootstrap 3 ??

是否可能与img响应类在bootstrap 3 ??

Is it possible with img-responsive class in bootstrap 3 ??

我的div是空的，如下所示：

My div is empty like below:

<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>

推荐答案

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

I think its not the case to use img-responsive here, since it was for <img />

并且为使 div 背景图片响应，我们可以使用 background-size：cover;

and for making the div background image responsive, we can use background-size: cover;

background-size：cover;

background-size: cover;

缩放图片，同时保留其内在长宽比（如果有的话），
到最小尺寸，使得其宽度和高度都可以
完全覆盖背景定位区域

Scale the image, while preserving its intrinsic aspect ratio (if any), to the smallest size such that both its width and its height can completely cover the background positioning area

这篇关于使div背景图像响应与bootstrap 3的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！