html - 此 html 是否无效，受格式影响的 span 元素

Question

此 Html(使用 Bootstrap 4)按我预期的方式工作

 <h6>
        01 - 01 - Apache.wav <span class="badge badge-pill badge-secondary">Updated</span>
        <span class="badge badge-pill badge-success">
            MusicBrainz
        </span>
        <span class="badge badge-pill badge-success">
            Discogs
        </span>
    </h6>

但如果我删除 pretty-print

<h6>01 - 01 - Apache.wav <span class="badge badge-pill badge-secondary">Updated</span><span class="badge badge-pill badge-success">MusicBrainz</span><span class="badge badge-pill badge-success">Discogs</span></h6>

然后它就不会在徽章之间放置填充。

这是为什么呢，是不是和h6里面有文字然后是span有关，是我的html不正确吗。

Answer 1

这是一篇解释浏览器如何处理制表符和空格的文章。 https://medium.com/@patrickbrosset/when-does-white-space-matter-in-html-b90e8a7cdd33

根据这篇文章，您的第一个代码片段中的制表符和新行被转换为空格。

作者在点中列出了浏览器遵循的机制(参见第 3 点)。