Html 如何在 Bootstrap 表单上放置背景图像？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/24924002/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to put a background image on a Bootstrap form?
提问by Gerardo Tarragona
I'm trying to put a background image on my form (like behind the text and inputs, just like a background image of my web site), using the Bootstrap framework but the image appears at the bottom and I want it inside the "container".
我正在尝试使用 Bootstrap 框架在我的表单上放置背景图像（例如在文本和输入后面，就像我网站的背景图像一样），但图像出现在底部，我希望它位于“容器”中”。
My code is something like this:
我的代码是这样的：
<div class="container">
<div class="thumbnail">
<form....>
<fieldset>
.
.
.
</form>
<img src="cs.jpg" class="img-responsive">
</div>
<div>
采纳答案by NathanG
Have you tried setting the background image of that container as the image? IE:
您是否尝试将该容器的背景图像设置为图像？IE：
.container {
background-image: url("cs.jpg");
}
Or you can do it inline:
或者您可以内联进行：
<div class="container" style="background-image: url('cs.jpg');">
...
</div>
回答by lazydeveloper
or you could try like this..
或者你可以像这样尝试..
<body>
<div class="jumbotron">
<div class="container">
<h1>Hello, world!</h1>
<p>...</p>
</div>
</div>
</body>
and in css like this:
在 css 中是这样的：
.jumbotron {
position: relative;
background: #fff url("slide.jpg") center center;/*slide.jpg =>you image*/
width: 100%;
height: 100%;
background-size: cover;
overflow: hidden;
}
