Html 如何消除img和div之间的差距？

display:block

适用于包含图像的部分，但不适用于只有背景色的部分。我尝试了不同的显示类型，添加负边距对我来说不是解决方案，因为这会破坏我的脚本

/* SECTION HOME */
#home {
  height: 100% !important;
  display: flex;
}

.sectionhome::before {
  /* setzt die richtige Höhe damit die Navbar das Bild nicht blockiert */
  display: block;
  content: " ";
  margin-top: -128px;
  height: 128px;
  visibility: hidden;
  pointer-events: none;
}

#homebild {
  display: block;
}

/* SECTION WIR-UEBER-UNS */
#wir-ueber-uns {
  height: 100% !important;
  display: flex;
}

.sectionwir-ueber-uns::before {
  display: block;
  content: " ";
  margin-top: -80px;
  height: 80px;
  visibility: hidden;
  pointer-events: none;
}

#wir-ueber-unsbild {
  display: block;
}

/* SECTION AKTIONEN */
#aktionen {
  height: 100% !important;
  display: flex;
}

.sectionaktionen::before {
  display: block;
  content: " ";
  margin-top: -80px;
  height: 80px;
  visibility: hidden;
  pointer-events: none;
}

#aktionenbild {
  display: block;
}

/* SECTION TERMINVEREINBARUNG */
#terminvereinbarung {
  height: 100% !important;
  display: flex;
}

.sectionterminvereinbarung::before {
  display: block;
  content: " ";
  margin-top: -80px;
  height: 80px;
  visibility: hidden;
  pointer-events: none;
}

#terminvereinbarungbild {
  display: block;
}

/* SECTION INFOS */
#infos {
  height: 1200px !important;
  display: flex;
  z-index: -5;
  position: relative;
  background-color: darkblue;
}

.sectioninfos::before {
  display: block;
  content: " ";
  margin-top: -80px;
  height: 80px;
  visibility: hidden;
  pointer-events: none;
}

#map {
  position: absolute;
  bottom: 6%;
}

---

你可以做的是，也许你可以在CSS的开始做这件事

*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

---

这将消除所有意外的边距和空格。

您好！你能给我们举个例子，我们可以看到这个问题吗？仅使用css很难精确定位。如果您可以只使用您遇到问题的部分制作一个代码片段，这样我们就可以看到受影响元素的html和css。您可以在通用选择器中提供0的边距和填充，这是我的测试fiddle@JannisN你想实现蓝色部分在图像下方没有任何间隙，对吗？这是正确的，谢谢你的支持帮助，但这似乎不起作用。