html - bootstrap form-inline 和 form-group 中 标签周围的空白

Question

查看 Bootstrap 时 Inline form docs，你可以看到标签和它的输入之间有一个空格(下面用黄色标记):

---

在 chrome 开发工具中检查它时，我看不到任何边距/填充/等。

---

更重要的是，创建了这个简单的 StackBlitz project来自复制粘贴 Bootstrap 的示例代码，但根本没有空格!

(注意:在我的 StackBlitz DEMO 中，稍微拉伸(stretch)右侧的显示以应用内联表单样式。)

---

我的问题实际上是两个问题:

1. bootstrap 文档页面中的这个空白是从哪里来的？
2. 在 chrome 开发工具中检查时，如何查看应用此空白的样式？

提前致谢。

Answer 1

大多数浏览器将源代码中的换行符呈现为内联元素的空白。如前所述，您可以将字体大小设置为 0 以防止出现这种情况。

检查 Bootstrap 示例页面的源代码实际上不仅显示了换行符，甚至还显示了特定元素的空白。您发布的 Angular-App 可能会在呈现源代码之前删除所有换行符和空格。