Question

我希望我的后台DIV始终能够填满整个浏览器窗口。我有一个DIV在背景之上，正如我想要的那样移动，我有按百分比设置的位置。当我缩小时，两个DIV一起移动，创建背景颜色的曝光。这是我的网站：

http://search.officesupplycentral.org/details.html

以下是我希望我的DIV如何运作的示例：

非常感谢任何帮助！

吉姆

Answer 1

fab.com使用了一种特殊方法，如果您只是检查网站代码，则很容易看到。

它设置HTML标记<html style="background-image: url(//s3.amazonaws.com/static.fab.com/relaunch/fab-daily-design-for-everyone-8.jpg);">的背景，并在CSS文件中为其设置以下值：

html{
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

然后在CSS中将背景设置为<body>透明：

body{
  background: transparent;
}

我没有进行过进一步研究的猜测是因为图片被设置为<html>标签的背景并且背景大小设置为覆盖它在页面放大或缩小时不会被处理

即使使用缩放也能填充浏览器窗口的DIV

1 个答案: