inline-block元素间空隙源于html解析器将换行/空格作为空白文本节点渲染，表现为约4px间隙；可通过html压缩、font-size:0、负margin或flex布局消除。
为什么 display: inline-block 元素之间总有看不见的空隙
这不是 bug，是 HTML 解析器把换行符和空白符当作文本节点渲染的结果。只要两个 inline-block 元素在源码里用换行或空格分隔，浏览器就会插入一个「空格字符」，而这个空格会参与行内布局，表现为约 4px 的间隙（取决于字体大小和 font-family）。
常见表现：nav 里的菜单项错位、gallery 图片网格对不齐、按钮组中间出现白线。
Comet AI 浏览器
下载
下载 Comet AI 浏览器，体验由 Perplexity AI 驱动的革命性上网方式。内置 AI 助手可实时总结网页、跨标签页对比信息、自动执行任务。告别繁琐操作，让 AI 成为你的浏览副驾，大幅提升研究与工作效率。支持 Windows、macOS、Android 和 iOS。
消除 inline-block 间距的四种可靠方法
没有“绝对最优”，选哪种取决于你是否能改 HTML 结构、是否要兼容老项目、以及是否已有字体设置干扰。
-
HTML 层面抹掉换行：把
<div class="item"></div> <div class="item"></div>写成一行，或用 HTML 注释连接：<div class="item"></div>
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
