为什么我的块元素之间有额外的空间，如何修复它？

删除块元素之间的空白

将块元素彼此相邻放置时，尽管设置了white-space: nowrap，但仍可能会遇到将它们分开的随机空格。这种间隙源于 HTML 中的空白字符，例如换行符或制表符。

解决方案：注释掉空白

一个简单的解决方案包括注释掉元素之间的空白：

<div>

这有效地消除了多余的空间并将元素无缝地彼此并排放置。

其他技巧

除了注释掉空格之外，您还可以考虑以下方法：

• 最小化 HTML：消除 HTML 中所有不必要的空格。
• 负边距： 将负边距应用于要重叠的元素
• 断开结束标签：拆分结束标签并将其放在新行上。
• 零字体大小父级：设置将父容器的字体大小设置为零并为子容器重置它元素。
• Flexbox： 使用 CSS Flexbox 控制元素之间的间距。

其他资源

• [Chris Coyier 的文章](https://css-tricks.com/fighting-the-space- Between-inline-block-elements/)
• [SO：图像和导航栏之间的间隙](https://stackoverflow .com/questions/13496260/why-is-there-a-gap- Between-image-and-navigation-bar)
• [SO：删除空格内联块元素之间](https://stackoverflow.com/questions/8156026/how-to-remove-the-space- Between-inline-block-elements)

以上是为什么我的块元素之间有额外的空间，如何修复它？的详细内容。更多信息请关注PHP中文网其他相关文章！