css - 移动网站背景图片的 CSS

Question

我正在使用 jQuery 移动工具包构建网站的移动版本。

页面将具有垂直布局（仅垂直滚动）。

我想在主页上显示背景图像，即使用户滚动到底部。

该图像是一个大图像，以无重复模式显示。图像必须在页面的左上角显示它的左上角，并尽可能地显示它的宽度和高度（图像应该调整大小以免被裁剪或最小化裁剪）。

是否可以为任何（或所有）不同的屏幕尺寸和方面提供图像？

score 1 · Accepted Answer

您可以使用width和heightCSS 媒体查询来根据用户视口的宽度和高度提供不同的背景图像。

如果您在<body>元素上设置背景图像，并将其background-attachment属性设置为fixed，那么即使用户滚动页面，背景图像也将保持在相对于视口的相同位置。

score 0 · Accepted Answer

在下面的媒体查询中进行您需要的 CSS 更改：

@media screen and (max-width: 480px) {
}

2 回答 2