Question

我试图创建我的页面，以便在页面的一侧有背景图像，而中心没有任何内容，因为内容将在那里。我希望这些图像保持固定的位置，即使用户调整窗口大小以使它们不在屏幕外。我知道如何至少设置图像，但不知道如何保留它们。

我认为我能想到的一个例子是如何设置http://www.halolz.com/。

Answer 1

通常这样做的方法是将背景图像应用于HTML正文，然后将页面的所有内容放入以页面为中心的容器中。

HTML：

<body>
    <div class="container">
         My content
    </div>
</body>

CSS：

html, body {
    padding: 0;
    margin: 0;
}
body {
    background: red; /* change this to your background image */
}

.container {
    background: white;
    width: 400px; /* adjust this to the proper width */
    margin: 0 auto;
}

JSFiddle：https://jsfiddle.net/13xaqh6z/

在页面两侧设置固定的背景图像

1 个答案: