Html H1导致div之间出现间隙

.heads

和

.container1

之间有一个间隙，这与

h1

标记有关。尝试没有h1和它的工作，但我需要h1那里虽然

如何消除

.heads

和

.container1

之间的差距

.heads{
背景色：#FF9000；
填充：0px 0px 0px 0px；
边框：1px实心#FFC223；
边框左上半径：8px；
边框右上角半径：8px；
边框底部：无；
边框右下半径：无；
边框左下半径：无；
}
h1{
填充：0；
字体大小：20px；
字体系列：Tekton Pro；
颜色：#71A00E；
}
.集装箱1{
宽度：100%；
边框：1px实心#006699；
背景：#0A3D5D；
浮动：左；
垫底：4px；
垫面：4px；
右边填充：0px；
左侧填充：4px；
明确：两者皆有；
边框右下半径：8px；
边框左下半径：8px；
边框右上半径：无；
边框左上半径：无；
}
p、 正常的{
字号：21px；
字体系列：tahoma；
颜色：#F7DF57；
}

有人来了
这里有一些文本

您可以从

h1

元素中删除

边距

：

h1 {
  margin: 0;
}

强烈建议阅读有关

h1

元素的内容

使用

*{
  padding:0;
  margin:0;
}

---

它将删除所有块元素的所有额外填充和边距。

尝试此操作，添加

边距：0在h1上

  h1 {
            padding: 0;
            font-size:20px;
        font-family:Tekton Pro;
        color:#71A00E;
          margin:0;
        }

这一差距是由以下因素造成的。总之，h1的底边与head元素的底边折叠。请注意，顶部边距没有折叠，因为head元素的边距和h1的边距之间存在边界

您可以使用各种技术来包含边距。最简单的方法是使用
overflow:hidden
（在本例中，您可以添加颜色与背景颜色匹配的底部边框）


.heads{
背景色：#FF9000；
边框：1px实心#FFC223；
边框底部：无；
/*删除无关规则*/
溢出：隐藏；
}
h1{
字体大小：20px；
颜色：#71A00E；
}
.集装箱1{
宽度：100%；
边框：1px实心#006699；
背景：#0A3D5D；
浮动：左；
明确：两者皆有；
/*删除无关规则*/
}
p、 正常的{
字号：21px；
颜色：#F7DF57；
}

有人来了
这里有一些文本
我只是将inline block的显示属性添加到h1或p元素，它删除了所有div间隙。
h1正在添加底部边距。。所以去掉h1的边距.“不幸的是，这不是一个好的做法。对文档中的每一个元素应用规则对渲染代理来说是非常繁重的，特别是对于大型网页，这也会破坏很多好的默认样式”。您应该避免使用通用选择器（*），因为它可能会导致一些性能问题。@Joelameida和Mehdi Brillaud：对于与通用选择器相关的性能问题，请在大多数情况下忽略影响cases@JoelAlmeida使用默认的填充和边距不是一个好的做法。因为不同的浏览器应用不同大小的填充和边距。为了匹配设计，我们需要从元素@RoySonasish中删除默认的padding和margin，问题不是padding和margin，而是通用选择器。但是就像Web TIKI指出的那样，在性能上的影响是可以忽略不计的，但有时你会删除按钮、提交等的样式，这可能会给你以后带来麻烦。请考虑添加代码/示例，并更好地解释你提出的答案。