Html IMG和H2元件之间的边缘塌陷不工作

图像和h2之间的垂直边距没有塌陷有什么原因吗？我有以下代码和样式。从所有的读数来看，没有例外，因为它是一个img标签。是因为IMG在技术上是在线的吗？至少在Chrome中，它添加了上下边距。将图像包装在块元素中是否更好

<section id="test">
    <img src="img/web_dev2@2x.png"/>
    <h2>Test</h2>
</section>

--编辑： 当我用一个P标记包装img并对其应用margin时，正如预期的那样，margin会崩溃。那么最佳做法是什么？

仅在块之间留有边距：

当且仅当满足以下条件时，两个边距为：

• 两者都属于同一流程中的一部分
• [……]

但默认情况下，图像是内联级别的。封锁它：

img，h2{
显示：块；
利润率：2米0；
}

试验

我想在这种情况下，阅读规范总是一个好主意

img, h2 {
    margin: 2em 0;
}