用css封闭内容和正文之间的空间

Question

在我的网页右上方（见附图）内容（背景图片）和正文之间有一个空格 我想用image.i来填充这个空间想要将图像加载到所有空间。我想关闭那个空格。我给边距，填充左边但不关闭那个空间

 .wrapper  {
       width:100%;
         margin:-5px;
      }

我应该怎么做

Answer 1

通过使用Chrome开发者工具，您可以快速看到该空间来自<div class="wrapper">的CSS边距属性。请参阅下面的打印屏幕。

在打印屏幕中，空格已消失，因为div.wrapper不再有边距。

修改 背景图片本身具有透明边框。如果用图形程序打开图片，可以看到这个。

最佳解决方案是使用图形程序删除边框，因为这样您就可以确定如何将图片设置在精确的像素位置。

如果您想将图片拉到左边以便将边框隐藏为快速解决方案，那么您必须将其向左拉并同时稍微拉伸，例如。

.wrapper {
   width: 101%;    /* <<<< a bit wider to hide at right */
   margin: -5px;   /* <<<< pull to hide at left */
   padding: 0
}

像这样，边框左右消失。

编辑2：

使用width: 101%，可能会出现滚动边框。要摆脱它们，请使用CSS overflow-x: hidden。 https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-x