如何在正文后面的页边距和顶部添加背景图像？（HTML，CSS）答案

【问题标题】：How do you add a background image in the margins and top of the page behind the body? (Html, Css)如何在正文后面的页边距和顶部添加背景图像？（HTML，CSS）
【发布时间】：2020-09-13 22:55:36
【问题描述】：

我正在构建一个网页，并尝试在容器后面的左侧、右侧和顶部的边距中添加图像。

在此演示中找到了与我当前网页最接近的示例：https://html5up.net/phantom。

我希望在这张图片中添加一个类似于蓝色的背景图片：https://i.stack.imgur.com/NHbqU.png

所以我希望图像位于浮动页面的后面。

【问题讨论】：

欢迎来到 Stackoverflow！放置在外部源代码上的代码很难为您提供帮助，请在此处添加可行的示例。

标签： html css web background wireframe

【解决方案1】：

好吧，添加body 的背景图像并将background: white（或您想要的任何颜色）添加到内容容器以避免正文背景“透光”。

【讨论】：

【解决方案2】：

下面的代码是你要找的吗？如果是这样，本质上它是“边框”的背景颜色，上面的元素有边距。

body {
  background-color: dodgerblue;
}

#content {
  position: fixed;
  background-color: #fff;
  border-radius: 15px;
  padding-top: 15px;
  text-align:center;
  
  height: 100%;
  width: 88%;
  margin: 25px;
}

<body>
  <div id="content">
    <h1>Wow!!</h1>
  </div>
</body>

【讨论】：