解决非换行内联块之间的空间
并排对齐块元素以跨越浏览器宽度时,使用white-space: nowrap 可能会很有效。但是,块之间可能存在意外的间距。
解决方案
间距通常源自内联(-block)元素之间的空白字符。消除此空格的一种方法是消除空格:
<div>
其他方法
删除空格的其他方法包括:
-
最小化HTML: 删除不必要的空格并格式。
-
负边距: 向子元素添加负边距。
-
打破结束标签: 将结束标签拆分为多行。
-
零字体大小技巧:将父级的字体大小设置为零并为子元素重置它。
-
浮动内联项目:单独浮动子元素。
-
使用 Flexbox:采用更现代的 Flexbox 布局灵活定位和对齐。
相关资源
如需进一步了解,请参阅 Chris Coyier 的文章或 Stack Overflow 上的类似主题:
- 为什么图像和导航栏之间有间隙
- 如何删除内联块元素之间的空格?
- 内联块列表之间的空格项目
- 如何从 HTML 中删除“不可见空间”
以上是如何消除内联块元素之间不需要的间距?的详细内容。更多信息请关注PHP中文网其他相关文章!