Question

我的代码遇到麻烦，我不知道为什么。该站点使我可以向右滚动，就像我在其中有一些图像或其他东西一样，但没有。为什么会这样？

我已经研究了保证金，但是什么也没找到。

body {
  background-image: url('icon/background.jpg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 1439px 851px;
  margin-top: 850px;
}

div.relative {
  position: relative;
  left: 255px;
  bottom: 805px;
}

<body>
  <div class="relative">
    <img src="icon/folder.png">
  </div>
</body>

Answer 1

div为width: auto，因此在渲染div时，它会占用水平方向上可用的空间。

它也是position: relative和left: 255px，所以它从左边偏移255个像素。这不会影响其大小（在应用定位之前确定大小）。

由于它从文档侧面伸出了将近255个像素，因此添加了滚动条，以便用户可以看到它。

如果要给元素一个左边界，请给它一个左边界。不要搞乱定位。

与left，top等结合使用时，相对定位几乎永远不会有用。它对于为元素后代的绝对定位提供上下文非常有用。

Answer 2

这是因为您将left属性设置为255px

div.relative {
  position: relative;
  left: 255px;
  bottom: 805px;
}

它将div移到255像素以上，因此它创建了滚动。

Answer 3

因此，我将“ width：20px”设置为该类，并对其进行了固定，请尝试

div.relative {
  position: relative;
  left: 255px;
  bottom: 805px;
  width: 20px;
}

为什么网站允许我向右滚动？

3 个答案: