Question

我需要一个固定的背景来获取浏览器的大小，并保持该大小，因此内容将向下，向左，向右滚动，但背景保持固定在后面。这可以用ipad2实现吗？

background: url("....") no-repeat fixed;
background-size: auto;
background-repeat: no-repeat;
background-attachment: fixed;

这样，背景加载的大小合适，但滚动时会滚动到背景颜色。

Answer 1

要实现这一目标，您可以使用background-size: cover;

我不确定我是否理解这个问题。如果我们的目标是设计一个iPad 2的特定背景，你可以考虑到iPad的分辨率，How large is the usable area in iPad Safari

@media screen and (max-width:1024px) {
    body {
        background:url(your-1024x690-image) fixed no-repeat; /*landscape background*/
    }
}

@media screen and (max-width:768px) {
    body {
        background:url(your-768x946-image) fixed no-repeat; /*portrait background*/
    }
}

没有测试过，但是应该这样做。

Answer 2

对于不同的浏览器支持..

  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;

css ipad 2网站内容滚动固定的背景

2 个答案: