image - 将图像放在内容容器之外

Question

我对这一切有点陌生，所以我的术语可能有点狡猾。

在此页面上 - halfbakedharvest.com - 有图像出现在屏幕边缘 - 在主要内容区域/容器之外。这些图片出现在每篇博文中，无论文章长短，这些图片都出现在相同的相对位置。

我如何复制它？

我已经尝试通过 Google 寻找答案，但我肯定没有使用正确的术语，因为我一无所获。它可以像我可以使用的插件一样简单吗？

如果它有助于我的网站使用 genesis 框架，并且在编辑 php 和 css 时我是一个自信的新手。

Answer 1

正如 Nath 所说，检查元素会发现它们正在使用绝对定位。 MDN absolute positioning

绝对定位将元素从页面的正常流中取出，并相对于它最近的定位祖先定位元素。用于定位元素的关键字 left、right、top 和 bottom。

body {
/* what you want to position relative to */
  margin: 0;
  width: 100%;
  height: 100%;
  position: relative;
}

img {
  position: absolute;
  top: 30%;
  right: 0;
}

注意 body 上的相对定位。 demo