如何为引导列提供背景图像？

Question

我只是想知道如何为引导程序中的列提供背景图像，因此它只会出现在该列中，而不是整个页面中。我试图这样做，这样我就可以让我的导航栏保持透明，并且只有它下面的列有背景图案。

Answer 1

首先你需要给 col 一个类名或 id 例如

<div class="col-xs-3 myImage">

您可以使用下面的示例将图像放置在容器本身中。在你的CSS中，你首先需要确保图像包含在列中，因此设置最大宽度参数。

.myImage{

display:block;

max-width:100%; // change this is you need it to be smaller

background-image:url('yourimagefoldername/imagefilename.jpg');

background-size: cover; // contain might suite you better

background-position:center; // this can be change to top, bottom or wherever

}

这几乎就是您需要做的全部事情。