How do I place a background in a container in Bootstrap?

Question

I’m trying to put a Background in a Container someone knows how to put or some other solution? I did not put in Body because the image needs to be Responsive.

Answer 1

You can reference the class container and apply the prowess backgroundin it, for example:

.container {
 background: #DDD;
}

In addition to color, you can apply responsive images, as in the example below:

.container{
background-image: url(caminho da imagem);
background-repeat: no-repeat;
background-size: 100%;
}

Stick to the priority order of your CSS. Usually I work with the raw bootstrap file and an additional CSS. With this, I keep the bootstrap in the original form and I make the changes in another style sheet which I import later the bootstrap. In short, my header looks something like this:

 <link rel="stylesheet" href="~/Content/css/bootstrap.min.css">
 <link rel="stylesheet" href="~/Content/css/Estilo.css">

If you don’t exactly have a CSS organization, the add-on !important, applied post declaration of a property and its value, may come to help. In case, your code could look like this:

.container {
 background: #DDD !important;
}

Answer 2

try like this:
.container { background-image: url(img/sua_imagem.png); background-repeat: repeat; }

in this case it would be a bg of a uniform tone, if it is an image ex: photograph, engraving, landscape no longer serve. tbm don’t forget the ! value at the end of the attributes

Answer 3

try it:

background-image: url("caminho da imagem"); 
background-repeat: no-repeat;
background-size: cover;