css - 自适应背景图片-引导网格-滚动条问题

我想在引导网格中创建全屏背景图像，以便可以响应。

我创建了一行并将其设置为100％的高度，以使其适合整个屏幕。

添加了1024 * 768px分辨率的图像，它完美地出现在背景中，但带有滚动条。

我只想摆脱滚动条，使其适合屏幕。这是我的html

html,body,.container-fluid{
    height:100%;
}

.row{
    height:100%;
}
 img {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  width: 100vw;
  height: 100vh;
 }

<div class="container-fluid">
    <div class="row" >
    <img src="retail.jpg">
        <div class="col-md-12">
        </div>
    </div>
</div>

有人能帮我吗 ？

最佳答案

这是东西
图片为全屏，内容在底部。

如果删除内容，则不会出现滚动条。

Bootply：http://www.bootply.com/sFNwejI4ow

CSS：

html,body,.container-fluid{
    height:100%;
}

.full{
    height:100%;
}
 img {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  width: 100%;
  height: 100%;
 }

HTML：

<div class="container-fluid">
    <div class="row full">
        <img src="//placehold.it/640x480">
    </div>
    <div class="row">
        <div class="col-md-12">
        Custom content
      </div>
    </div>
</div>