100％宽度和高度的图像之前的其余内容

Question

我试图实现这样一个效果，如看到f.e.这里：http://www.createpilates.com/

我想要做的是有一个“封面”图像作为网站加载，然后如果用户向下滚动，内容是可见的。

注意，第一个图像总是覆盖加载屏幕的100％，无论我调整窗口等

有人可以帮我吗？谢谢！

Answer 1

确保您的元素都有充分的高度和宽度设置，然后你使用这样的：

#element { 
    width: 100%; 
    height: 100%; 
    background: url("yourimage.jpg") no-repeat center center fixed; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    -webkit-background-size: cover; 
    background-size: cover; 
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="yourimage.jpg", sizingMethod="scale"); 
}