1

我正在创建一个流畅的响应式网站，其中包含多个包含 CSS 背景图像的部分。我将如何使这些图像具有流畅的响应性？我知道如何使用标准标签执行此操作，但无法为 CSS 背景图像解决此问题。正如您在下面看到的，每个标签都将在我的 CSS 中包含一个背景图像。

我的网站结构：

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Example</title>
</head>
<body>
    <section id="background-image-one"></section>
    <section id="background-image-two"></section>
    <section id="background-image-three"></section>
</body>
</html>
4

1 回答 1

1

您可以使用background-size来缩放应该适用于大多数移动设备的图像 - 但不适用于某些较旧的桌面浏览器（通常的嫌疑人）。不过，这不会缩小图像，因此可能值得查看类似http://adaptive-images.com/的东西，它可以将不同尺寸的图像提供给具有不同屏幕尺寸的设备。注意不是不同的视口大小。

于 2013-04-16T14:50:20.343 回答