拉伸div的背景

Question

我需要在div元素中拉伸图像。

所以在网站上：http://fishcacher.sytes.net/有背景图片

表示“fc-container”div元素：

.fc-container {
    background-image:url('../images/bg_1400.png'); 
    background-repeat:no-repeat;  
    margin:0px; 
    background-size: cover;
}

我需要它的工作方式与此http://www.htmlite.com/faqEX004.html完全相同，但在我的“fc-container”div元素中。目前很多图像隐藏在底栏下方。

我尝试了不同的方法，但无法解决这个问题。

感谢任何帮助。非常感谢！

Answer 1

将这些样式添加到您的fc-container

position:fixed; top:0; left:0; width:100%; height:100%;

Answer 2

在您的示例网站上，他们没有单独使用CSS来创建背景，他们使用了一个包含图像的包装，然后将图像拉伸以填充整个屏幕。这是必需的HTML代码：

<div class="backgroundimagewrapper">
    <img class="backgroundimage" src="http://fishcacher.sytes.net/images/bg_1200.png" />
</div>

这是CSS

.backgroundimagewrapper{
    position: absolute; /* So we can position our div precisely */
    left: 0; /* Move it to the top-left */
    top: 0;
    z-index: -100; /* Make it appear behind other elements */
    padding: 0; /* Make sure we don't have any white space around the edges */
    margin: 0;
    width: 100%; /* Make it fill our whole screen */
    height: 100%;
}
.backgroundimage{
    width: 100%; /* Make the image fill the whole div */
    height: 100%;
 }

他们是如何在您链接的网站上完成的。 无论如何，这是一个带有代码的JSFiddle：http://jsfiddle.net/T2t5m/5/