1

I know how to set page background like;

body{
  background-color: blue;
  background-image: url(imagename.ext);
  background-repeat: no-repeat;
  background-position: left;
}

The page is subject to zoom. Using the browser, user can zoom in and zoom out. But the background image may not zoom-in or zoom-out. It may remain as such, in it's default size. Is this possible?

4

4 回答 4

2 
html { 
  background: url(images/bg.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
于 2013-08-22T12:06:32.277 回答
0

与问题无关，但这可能对某人有所帮助。为此，我将使用http://srobbin.com/jquery-plugins/backstretch/之类的 jquery 插件。

通过 css 获得整页静态背景（如 Anup Jangid 的回答）时，我一直遇到速度问题。它使页面的滚动非常缓慢和缓慢。

于 2013-08-22T12:26:16.343 回答
0

您可以使用 css：

background-size: cover;

教程：http ://css-tricks.com/perfect-full-page-background-image/

于 2013-08-22T12:02:23.743 回答
0

我认为没有一种原生的干净方式可以实现您的要求。这种方法应该可以工作，但是随着浏览器缩放后尺寸的调整，您可能会出现一些（也许可以接受）闪烁。

指定 background-size:widthpx heightpx 并且当浏览器缩放时您需要检测缩放比例（请参阅如何在所有现代浏览器中检测页面缩放级别？）并相应地设置背景图像的宽度 px 和高度 px。

于 2013-08-22T13:09:45.143 回答